@font-face {
    font-family: 'Dream Avenue';
    src: url('../fonts/FontsFree-Net-Dream-Avenue.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --primary-font: "Gotham", sans-serif;
    --secondary-font: 'Dream Avenue', serif;
    --primary-color: #840F41;
    --text-color: #707070;
    --white-color: #ffffff;
    --black-color: #000000;
    --primary-bg: #ffffff;
    --secondary-bg: #f4f2ef;
}

/* 
==========================================================================
GLOBAL TYPOGRAPHY - BASE STYLES
========================================================================== 
*/

body {
    font-family: var(--primary-font);
    font-weight: 200;
    font-size: 16px; 
    line-height: 1.6;
    color: var(--text-color);
}

p { font-size: 16px; }

h1, h2, 
.sty__intro .title h1, 
.sty__intro .title h2 {
    font-family: var(--secondary-font) !important;
    font-weight: 200;
    color: var(--primary-color);
}

h3, h4, h5, h6,
.sty__intro .title h3,
.sty__2col-f .text .title h4,
.title-special_offers h5,
.sdty__reviews .title h6 {
    font-family: var(--primary-font) !important;
    font-weight: 400;
    margin-bottom: 10px;
}

.detail {
    font-family: var(--primary-font);
    font-weight: 200;
    max-width: 1360px;
    margin: auto;
    text-align: left;
}

.v2link__readmore {
    font-family: var(--primary-font);
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    display: inline-block;
    padding: 12px 24px;
    transition: all 0.3s ease;
}


/* 
==========================================================================
CUSTOM CSS
==========================================================================
*/
header { background-color: transparent !important; }
header.fixedtop { background-color: var(--primary-color) !important; padding: 10px 0 !important; box-shadow: 0px 4px 10px 2px rgba(0, 0, 0, 0.15); }
body #sec__mainslide { padding-top: 0 !important; }
body .main_slide_wrap { margin-top: 0 !important; }
body .sty__intro .title h1 { font-size: 48px !important; }
body .sty__intro .title h2 { font-size: 24px !important; padding-top: 20px; font-weight: 200; }
body .sty__intro .title h3 { font-size: 20px !important; color: var(--black-color); font-weight: 400; padding-top: 10px; }
body .sty__intro .title h4 { font-size: 20px !important; }
body .sty__intro .detail p { font-size: 16px !important; }
body .pd__m_intro { padding-bottom: 0 !important; }
body .pd__m_intro.intro-last { padding-bottom: 100px !important; }
body .pd__m_intro.intro-extra { padding-bottom: 150px !important; }
body .pd__m_intro.bg-dark { padding-bottom: 100px !important; background-color: var(--secondary-bg); }
body .container { max-width: 1360px !important; margin: 0 auto !important; }
header .container, footer .container { max-width: 1360px !important; margin: 0 auto !important; }

/* Header */
.sty__header .h_logo { filter: brightness(0) invert(1); }
.sty__header .h_mainmenu #menu-main_menu li { border: 1px solid var(--white-color); border-radius: 40px; padding: 10px 20px; }
.sty__header .h_mainmenu #menu-main_menu li:hover { background-color: var(--primary-color); color: var(--white-color); border: 1px solid var(--primary-color); }
.sty__header .h_mainmenu #menu-main_menu a { color: var(--white-color); font-size: 14px; padding: 0; }
.sty__header .h_mainmenu .current-menu-item { background-color: var(--white-color); }
.sty__header .h_mainmenu .current-menu-item a { color: var(--primary-color) !important; }
.sty__header .h_mainmenu .current-menu-item:hover a { color: var(--white-color) !important; }
.sty__header .h_mainmenu .sub-menu .current-menu-item { background: none !important; }
.sty__header .h_mainmenu .sub-menu li { border: none !important; }
.sty__header .h_mainmenu .sub-menu li a { color: var(--white-color) !important; padding: 5px 0 !important; }
.sty__header .h_mainmenu .sub-menu li a:hover { background-color: var(--primary-color) !important; opacity: 0.5; }

.sty__header .h_mainmenu #menu-main_menu li:hover .wrap-submenu { max-height: none; }
.sty__header .h_mainmenu #menu-main_menu .sty__moremenu li > .wrap-submenu .submenu_2 a { padding-left: 10px !important; }
.sty__header .h_mainmenu #menu-main_menu .sty__moremenu li > .wrap-submenu .submenu_2 a:before { top: 50%; }
.sty__header .h_mainmenu #menu-main_menu .sub-menu .submenu_2 li { padding: 0 !important; }

.sty__header .h_mobile_menu .icon--mobilemenu span { background-color: var(--white-color) !important; }

.sty__header .h_booknow .btn__booknow { background-color: var(--primary-color) !important; padding: 10px 20px; border-radius: 40px; font-size: 14px; }
.sty__header .h_booknow .btn__booknow:hover { background-color: var(--white-color) !important; border: 1px solid var(--white-color); }

.fixedtop .sty__header .h_booknow .btn__booknow { background-color: var(--white-color) !important; border: 1px solid var(--white-color); color: var(--primary-color) !important; }
.fixedtop .sty__header .h_booknow .btn__booknow:hover { background-color: var(--primary-color) !important; border: 1px solid var(--white-color); color: var(--white-color) !important; }


/* SECTION: SLIDER */
.hero-banner-section { position: relative; width: 100%; height: 100vh; min-height: 600px; overflow: hidden; background-color: transparent; }
.hero-media-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.hero-video-bg { width: 100%; height: 100%; object-fit: cover; pointer-events: none; opacity: 1; }
.hero-overlay-content { position: relative; z-index: 10; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 20px; background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 100%); }
.hero-play-btn { display: inline-flex !important; justify-content: center; align-items: center; width: 80px; height: 80px; border: 2px solid var(--white-color); border-radius: 50%; text-decoration: none; margin-top: 30px; transition: all 0.3s ease; }
.hero-play-btn:hover { background-color: var(--white-color); transform: scale(1.1); }
.hero-play-btn .play-icon { color: var(--white-color); font-size: 30px; margin-left: 6px; transition: color 0.3s ease; }
.hero-play-btn:hover .play-icon { color: var(--primary-color); }

.vdo-text { position: absolute; bottom: 80px; left: 80px; display: flex; flex-direction: column; text-align: justify; }
.vdo-text .hero-title { font-family: var(--primary-font); text-align: left; color: var(--primary-color); }
.vdo-text .hero-subtitle { font-family: var(--secondary-font); text-align: left; color: var(--white-color); }

/* SECTION: OUR 4 PILLARS */
.title-with-lines { text-align: left; position: relative; margin-bottom: 30px;left: 100px; }
.title-with-lines h1 { display: inline-block; position: relative; padding: 0 30px; color: var(--white-color); }
.title-with-lines h1::before {
    content: "";
    position: absolute;
    top: 50%;
    width: 100px;
    height: 1px;
    background-color: #9a8a7a; 
}
.title-with-lines h1::after {
    content: "";
    position: absolute;
    top: 50%;
    width: calc(100% + 300px);
    height: 1px;
    background-color: #9a8a7a; 
}
.title-with-lines h1::before { right: 100%; }
.title-with-lines h1::after { left: 100%; }
.sty__4col_pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; width: 100%; }
.pillar-box { position: relative; width: 100%; aspect-ratio: 3 / 4; overflow: hidden; }
.pillar-box img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.pillar-box:hover img { transform: scale(1.05); }
.pillar-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 80%; z-index: 2; }
.pillar-text h4 { color: var(--white-color) !important; font-family: var(--primary-font) !important; font-weight: 400; font-size: 20px; letter-spacing: 2px; text-transform: uppercase; margin: 0; line-height: 1.4; text-shadow: 1px 1px 5px rgba(0,0,0,0.4); }
.pillar-description { text-align: center; margin-top: 40px; }
.pillar-description .detail { max-width: 1360px; margin: 0 auto; color: var(--text-color); text-align: center; font-size: 16px; }

/* SECTION: WELLNESS PROGRAMS */
#sec__wellness_programs { background-color: #f4f2ef;}
.detail-button-right { display: flex; justify-content: right; }
.detail-button-left { display: flex; justify-content: left; }
.double-detail-button { display: flex; flex-direction: column; }
/* .sty__3col_programs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 40px; } */
.sty__3col_programs { 
    display: grid; 
    /* เปลี่ยนจาก 3 เป็น 6 คอลัมน์ย่อย */
    grid-template-columns: repeat(6, 1fr); 
    gap: 30px; 
    margin-top: 40px; 
}

/* ให้การ์ดทุกใบกินพื้นที่ทีละ 2 คอลัมน์ย่อย (แถวแรกจะได้ 3 ใบพอดี) */
.sty__3col_programs > div {
    grid-column: span 2;
}

/* บังคับให้ใบที่ 4 (ใบแรกของแถวสอง) ขยับมาเริ่มที่เส้นกริดที่ 2 เพื่อดันให้เข้ากึ่งกลาง */
.sty__3col_programs > div:nth-child(7) {
    grid-column: 2 / span 2;
}
.program-card { position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 3 / 4; display: flex; flex-direction: column; justify-content: flex-end; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.program-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.program-image img { width: 100%; height: 100%; object-fit: cover; transition: all 0.5s; }
.program-card:hover .program-image img { transform: scale(1.05); filter: brightness(0.7); }
.program-content { opacity: 0; display: flex; flex-direction: column; flex-grow: 1; position: relative; z-index: 2; background: rgb(139 20 61 / 80%); padding: 25px 20px; margin: 15px; border-radius: 10px; max-height: 240px; transform: translateY(30px); /* ดันกล่องลงไปด้านล่างเล็กน้อย */ transition: all 0.4s ease-in-out; /* ทำให้การปรากฏตัวดูนุ่มนวล */ }
.program-card:hover .program-content { opacity: 1; visibility: visible; transform: translateY(0); }
.program-content h3 { font-family: var(--primary-font) !important; font-weight: 400; font-size: 20px; color: var(--white-color) !important; text-align: left; text-transform: uppercase; letter-spacing: 1px; padding-bottom: 5px; }

.sub-program-list { list-style: none; padding: 0; margin: 0; }
.sub-program-list li { color: var(--white-color); margin: auto; padding-bottom: 10px; text-align: left; list-style: none; font-size: 16px; }
.sub-program-list li:last-child { margin-bottom: 0; border-bottom: none; padding-bottom: 0; }
.sub-program-list a { display: flex !important; justify-content: space-between !important; align-items: center; color: var(--white-color) !important; font-family: var(--primary-font) !important; font-weight: 400; font-size: 16px; text-decoration: none; transition: opacity 0.3s ease; }
.sub-program-list a:hover { opacity: 0.7; }
.sub-program-list .arrow { font-weight: 300; font-size: 18px; }

/* SECTION: WELLNESS FACILITIES */
#sec__wellness_facilities .sec-main-heading h2 { font-family: var(--primary-font) !important; font-size: 36px; color: var(--black-color); font-weight: 100; padding: 0 !important; margin: 0; }
.sec-main-heading { margin-bottom: 60px; grid-gap: 0 !important; }
.sec-main-heading h2 { font-family: var(--primary-font); font-weight: 400; font-size: 24px; color: var(--black-color); margin-bottom: 10px; }
.sec-main-heading p { font-size: 16px; color: var(--text-color); }
.wellness-feature-flex { max-width: 1360px; margin: 0 auto; display: flex; flex-direction: column; }
.feature-title-wrap { align-self: flex-end; text-align: right; margin-bottom: 20px; display: flex; flex-direction: column; align-items: flex-end; }
.title-with-lines-right { display: inline-block; position: relative; padding: 0 30px; right: 100px; }
.title-with-lines-right::before {
    content: "";
    position: absolute;
    top: 40%;
    right: 100%;
    width: calc(100% - 135px);
    height: 1px;
    background-color: #9a8a7a; 
}
.title-with-lines-right::after {
    content: "";
    position: absolute;
    top: 40%;
    left: 100%;
    width: 100px;
    height: 1px;
    background-color: #9a8a7a; 
}
.title-with-lines-right h1,
.title-with-lines-right h3 { text-align: right; line-height: 1 !important; padding: 0 !important; margin: 0 !important; }
.title-with-lines-left { display: inline-block; position: relative; padding: 0 30px; left: 100px; }
.title-with-lines-left::before {
    content: "";
    position: absolute;
    top: 40%;
    right: 100%;
    width: 100px;
    height: 1px;
    background-color: #9a8a7a; 
}
.title-with-lines-left::after {
    content: "";
    position: absolute;
    top: 40%;
    left: 100%;
    width: calc(100% + 140px);
    height: 1px;
    background-color: #9a8a7a; 
}
.title-with-lines-left h1,
.title-with-lines-left h3 { text-align: left; line-height: 1 !important; padding: 0 !important; margin: 0 !important; }
.feature-title-wrap h1 { font-family: var(--primary-font); font-size: 48px; color: var(--primary-color); margin: 0; }
.feature-title-wrap h3 { font-family: var(--primary-font); font-weight: 700; font-size: 16px; color: var(--black-color); margin-top: 5px; }
.feature-flex-row { display: flex; flex-wrap: wrap; width: 100%; }
.feature-left-media { max-width: 50%; position: relative; /* top: 10px; */ }
.wellness-swiper { width: 100%; height: 100%; border-radius: 0 30px 30px 0; overflow: hidden; z-index: 3; }
.wellness-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.swiper-pagination { position: absolute; bottom: 20px; width: 100%; text-align: center; z-index: 10; }
.swiper-pagination-bullet { width: 10px; height: 10px; background: var(--white-color); opacity: 0.5; transition: all 0.3s ease; }
.swiper-pagination-bullet-active { opacity: 1; background: var(--white-color); width: 20px;  border-radius: 5px; }
.feature-right-content { max-width: 50%; background-color: var(--secondary-bg); padding: 50px 50px 100px; display: flex; flex-direction: column; justify-content: center; position: relative; top: 40px; }
.detail-text { font-family: var(--primary-font); font-size: 16px; color: var(--text-color); line-height: 1.8; margin-bottom: 30px; }
.detail-text p { margin: 0; padding: 0; font-size: 16px; }
.link-arrow-text { font-family: var(--secondary-font); font-size: 24px; color: var(--primary-color); text-decoration: none; display: inline-flex; align-items: center; gap: 12px; transition: opacity 0.3s ease; }
.link-arrow-text:hover { opacity: 0.7; }
.link-arrow-text .arrow { font-family: var(--primary-font); font-weight: 300; font-size: 20px; }
.feature-icon-bar-full { width: 100%; background-color: #9a8a7a; padding: 60px 40px 40px; margin-top: -20px; position: relative; z-index: 2; }
.icon-flex-scroll { display: flex; justify-content: center; gap: 40px; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; scrollbar-width: none; }
.icon-flex-scroll::-webkit-scrollbar { display: none; }
.icon-item { text-align: center; color: var(--white-color); flex: 0 0 auto; scroll-snap-align: start; min-width: 80px; }
.icon-item img { height: 40px; width: 40px; margin-bottom: 10px; filter: brightness(0) invert(1); display: inline-block; }
.icon-item span { display: block; font-family: var(--primary-font); font-size: 16px; font-weight: 400; line-height: 21px; }
.icon-link { position: unset !important; color: var(--white-color) !important; display: flex !important; flex-direction: column; align-items: center; width: 100%; }
.icon-link:hover { opacity: 0.7; }
.icon-link:hover img { filter: brightness(0) saturate(100%) invert(13%) sepia(63%) saturate(3286%) hue-rotate(321deg) brightness(95%) contrast(99%); }
.icon-link:hover span { color: var(--primary-color); }
.amenities-swiper { width: 100%; padding: 0 50px; box-sizing: border-box; position: relative; }
.amenities-swiper.icon-flex-scroll { overflow: hidden; scroll-snap-type: none; -webkit-overflow-scrolling: auto; }
.amenities-swiper .swiper-wrapper { align-items: center; align-items: flex-start; }
.amenities-swiper .swiper-button-next,
.amenities-swiper .swiper-button-prev { color: #ffffff; opacity: 0.7; transition: opacity 0.3s ease; }
.amenities-swiper .swiper-button-next:hover,
.amenities-swiper .swiper-button-prev:hover { opacity: 1; }
.amenities-swiper .swiper-button-next::after,
.amenities-swiper .swiper-button-prev::after { font-size: 24px; }
.amenities-swiper .swiper-button-next { right: 10px; }
.amenities-swiper .swiper-button-prev { left: 10px; }

/* SECTION: ACCOMMODATION (MIRRORED LAYOUT) */
.accommodation-feature-flex { max-width: 1360px; margin: 0 auto; display: flex; flex-direction: column; }
.accommodation-title-wrap { align-self: flex-start; text-align: left; margin-bottom: 20px; display: flex; flex-direction: column; align-items: flex-start; }
.accommodation-title-wrap h1 { font-family: var(--primary-font); font-size: 48px; color: var(--primary-color); margin: 0; }
.accommodation-title-wrap h3 { font-family: var(--primary-font); font-weight: 700; font-size: 16px; color: var(--black-color); margin-top: 5px; }
.accommodation-swiper { width: 100%; height: 100%; border-radius: 30px 0 0 30px; overflow: hidden; z-index: 3; }
.accommodation-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* SECTION: GROUP RETREATS */
.group-retreat-flex { max-width: 1360px; margin: 0 auto; display: flex; flex-direction: column; padding: 0; }
.group-retreat-flex .feature-flex-row { align-items: center; }
.group-retreat-flex .feature-right-content { top: 0; }
.group-retreat-flex .title-with-lines-left::after { 
    content: "";
    position: absolute;
    top: 40%;
    left: 345px;
    width: calc(30% - 20px);
    height: 1px;
    background-color: var(--text-color);
}
.retreat-img { width: 100%; height: 100%; min-height: 450px; object-fit: cover; border-radius: 0 30px 30px 0; display: block; }
.retreat-content { flex: 0 0 50%; max-width: 50%; background-color: transparent; padding: 0 0 0 50px; display: flex; flex-direction: column; justify-content: left; }
.retreat-content .title-with-lines-left { left: 0; padding: 30px 0; }
.retreat-content .title-with-lines-left::before { display: none; }
.feature-right-content { text-align: left; }
.feature-right-content h1 { text-align: left; }
.retreat-buttons {  display: flex; gap: 15px; flex-wrap: wrap; margin-top: 15px; }
.btn-pill-light, 
.btn-pill-brown { font-family: var(--primary-font); font-weight: 400; font-size: 16px; padding: 12px 35px; border-radius: 40px; text-decoration: none; transition: all 0.3s ease; display: inline-block; text-align: center; }
.btn-pill-light { background-color: var(--secondary-bg); color: var(--text-color) !important; }
.btn-pill-light:hover { opacity: 0.5; }
.btn-pill-brown { background-color: #9a8a7a; color: var(--white-color) !important; }
.btn-pill-brown:hover { opacity: 0.5; }

/* SECTION: THE LOVE KITCHEN */
#sec__the_love_kitchen .container { display: flex; justify-content: center; }
.love-kitchen-wrapper {
    position: relative;
    width: 100%;
    max-width: 1360px;
    min-height: 450px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-radius: 0; 
    overflow: hidden;
}
.love-kitchen-wrapper::before {
    content: "";
    position: absolute;
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0;
    z-index: 1; 
}
.love-kitchen-content { position: relative; z-index: 2; max-width: 50%; padding: 50px 60px; height: 100%; background-color: rgba(0, 0, 0, 0.2); text-align: left; }
.lk-title,
.lk-subtitle { position: relative; display: inline-block; z-index: 0; }
.lk-subtitle { font-weight: 200 !important; text-transform: none !important; }
.lk-subtitle span { font-weight: 400 !important; text-transform: uppercase !important; }
.lk-title::after,
.lk-subtitle::after {
    content: "";
    position: absolute;
    inset: -10px -10px;
    z-index: -1;
    background: radial-gradient(ellipse at center, rgb(255 255 255 / 60%) 0%, rgb(255 255 255 / 60%) 25%, rgb(255 255 255 / 60%) 75%, transparent 100%);
    filter: blur(12px);
    border-radius: 50%;
}
.lk-title { font-family: var(--secondary-font); font-size: 42px; color: var(--primary-color); margin: 0 0 10px 0; line-height: 1.2; }
.lk-subtitle { font-family: var(--primary-font); font-weight: 700; font-size: 28px; color: var(--primary-color);  text-transform: uppercase;  margin: 0 0 20px 0;  }
.lk-detail { font-family: var(--primary-font); font-size: 16px; color: var(--white-color); line-height: 1.6; margin-bottom: 30px; }
.lk-detail p { margin-bottom: 15px; }
/* GLOBAL BUTTON: PILL OUTLINE WHITE */
.btn-pill-outline-white { font-family: var(--primary-font); font-weight: 400; font-size: 16px; color: var(--white-color) !important; padding: 10px 40px; border: 1px solid var(--white-color); border-radius: 40px; text-decoration: none; display: inline-block; background-color: transparent; transition: all 0.3s ease; }
.btn-pill-outline-white:hover { background-color: var(--white-color); color: var(--primary-color) !important; }

/* SECTION: SPECIAL OFFERS */
#sec__special_offers .sdty__2slide { max-width: 1024px; margin: 0 auto; }
#sec__special_offers .slick-list { overflow: visible; }
#sec__special_offers .slick-slide.slick-active { transform: scale(1); opacity: 1; transition: all 0.5s ease-in-out; }
#sec__special_offers .slick-slide { transform: scale(0.85); opacity: 0.5; transition: all 0.5s ease-in-out; }
#sec__special_offers .slick-dots { display: flex; justify-content: center; list-style: none; padding: 0; margin: 40px auto 0; width: 100%; max-width: 500px; right: 0; left: 0; bottom: -50px; gap: 0; }
#sec__special_offers .slick-dots li { flex-grow: 1; margin: 0; height: 4px; }
#sec__special_offers .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 100%; height: 100%; padding: 0; cursor: pointer; border: none; outline: none; background: var(--text-color); border-radius: 0; box-shadow: none; transition: all 0.5s ease-in-out; }
#sec__special_offers .slick-dots li:first-child button { border-radius: 30px 0 0 30px; }
#sec__special_offers .slick-dots li:last-child button { border-radius: 0 30px 30px 0; }
#sec__special_offers .slick-dots li.slick-active button { background: var(--primary-color); }

/* SECTION: GUEST REVIEWS (TESTIMONIALS) */
#sec__awards { padding: 100px 0 !important; }
#sec__awards .slide_awards { margin-bottom: 0; }
#sec__guest_reviews .sdty__reviews { padding-top: 0 !important; }
.section-reviews { background-color: var(--secondary-bg); padding: 80px 0; }
.review-header { margin-bottom: 50px; }
.review-title { font-family: var(--secondary-font); font-size: 48px; color: var(--primary-color); margin-bottom: 10px; }
.review-subtitle { font-family: var(--primary-font); font-weight: 700; font-size: 18px; color: var(--primary-color); padding: 0; margin: 0; }
.review-slider-wrap { max-width: 900px; margin: 0 auto; }
.review-content-box { position: relative; padding: 0 80px; text-align: center; }
.review-content-box::before {
    content: "\201C";
    font-family: var(--primary-font);
    font-size: 120px;
    color: var(--primary-color);
    position: absolute;
    left: 0;
    top: 30%;
    transform: translateY(-50%);
    line-height: 1;
}
.review-content-box::after { 
    content: "\201D"; 
    font-family: var(--primary-font); 
    font-size: 120px; 
    color: var(--primary-color); 
    position: absolute; 
    right: 0; 
    top: 30%; 
    transform: translateY(-50%); 
    line-height: 1; 
}
.review-text { font-family: var(--primary-font); font-size: 16px; color: var(--text-color); line-height: 26px; margin-bottom: 25px; }
.review-text p { margin-bottom: 0; }
.review-author { font-family: var(--primary-font); font-size: 18px; color: var(--primary-color); font-weight: 400; }
.review-logo { margin-top: 50px; }
.review-logo img { max-width: 180px; height: auto; }
.review-pagination { bottom: -10px !important; }

/* SECTION: AWARD */
.section_awards .sty__intro .title h1 { color: var(--text-color) !important; }

/* OTHER PAGE */
header .h_mainmenu #menu-main_menu .sub-menu { background-color: var(--primary-color) !important; }
header .h_mainmenu #menu-main_menu li .wrap-submenu:before { background-color: var(--primary-color) !important; }
header .h_mainmenu #menu-main_menu .submenu_2 { background-color: var(--primary-color) !important; }
.amenities { padding: 80px 0 40px; }
.reserv_box .btn_link { background-color: var(--primary-color); }
.reserv_box .btn_link:hover { background-color: var(--white-color); border: 2px solid var(--primary-color); color: var(--primary-color); }
.btn_link { color: var(--white-color); font-weight: 400; padding: 10px 20px; border: 1px solid var(--white-color); border-radius: 40px; }
.btn_link:hover { border: 1px solid var(--primary-color); }
.btn_link.btn-pill-outline-white { color: var(--primary-color) !important; border: 1px solid var(--primary-color); font-size: 16px; width: auto; padding: 10px 20px !important; text-transform: capitalize; }
.btn_link.btn-pill-outline-white:hover { background-color: var(--primary-color); color: var(--white-color) !important; }
.wrap_room .btn_link { border-radius: 40px; font-size: 16px; text-transform: capitalize; margin: 0; padding: 10px 20px; }
.resp-tabs-list li { font-size: 16px; font-weight: 200; line-height: 1.5; text-align: left; }
.resp_inner_content p { padding-bottom: 10px; }
.programs { padding: 30px 0 0; }
.btn_link2.btn_phone { padding-left: 40px; }
.wellness_box2:hover { transition: all 0.5s; opacity: 0.7; }
.wellness_box2 h5 { padding: 10px 20px !important; border-radius: 40px !important; } 
.wellness_box2:hover h5 { background-color: var(--white-color) !important; color: var(--primary-color) !important;}
#retreatkit .btn_link.btn-pill-outline-white {  color: var(--white-color) !important; border: 1px solid var(--white-color); }
#retreatkit .btn_link.btn-pill-outline-white:hover {  color: var(--white-color) !important; border: 1px solid var(--primary-color); }
.btn_link3 { font-size: 16px; border-radius: 40px; background-color: var(--primary-color); }
.btn_link3:hover { font-size: 16px; border-radius: 40px; background-color: var(--white-color); color: var(--primary-color) !important; }
.btn_link2 { border-radius: 40px; background-color: var(--primary-color); color: var(--white-color); padding: 10px 20px; font-size: 16px; text-transform: capitalize; z-index: 0; }
.btn_link2:hover { background-color: transparent; color: var(--primary-color); }
.btn_link2:after, .btn_link3:after { display: none; }
.btn_scroll span { color: var(--white-color); }
.faqs_wrap .question { font-weight: 400; }
.sec__listoffers .box .detail p { font-size: 16px; }
.sec__offercontactus form input[type="submit"] { border: 1px solid var(--primary-color) !important; border-radius: 40px; font-family: var(--primary-font); font-weight: 200; text-transform: capitalize; font-size: 16px; }
.sec__offercontactus form input[type="submit"]:hover { background-color: transparent !important; color: var(--primary-color) !important; border: 1px solid var(--primary-color) !important; }
#filter li { padding-right: 40px; }
button, html input[type="button"], input[type="submit"] { border-radius: 40px; text-transform: capitalize; font-size: 14px; font-family: var(--primary-font); font-weight: 200; }
input[type="submit"]:hover { background-color: transparent !important; border: 1px solid var(--primary-color) !important; color: var(--primary-color) !important; }
.page-id-1852 header { background-color: var(--primary-color) !important; }
.page-id-1852 header .sty__header .h_booknow .btn__booknow { border: 1px solid var(--white-color); }
.postid-176 .content_section .wrap_container.padding_maincontent { display: none; }
.postid-176 .content_section br { display: none; }
.page-id-71 #content_first { padding: 40px 0 0; }
.resp-tab-content { padding: 40px; }
ul.resp-tabs-list { display: flex; padding-bottom: 0; }
.wrap_media_mag { padding: 0; }
.group-retreat .wellness_box2 h3 { line-height: 1.4; }
#gallery .box.fancy-video { width: 16.66% !important; }
.main-blog-wrap { margin-top: 0; }
.wrap-entry-blog .wp-pagenavi a, .wrap-entry-blog .wp-pagenavi span { font-weight: 400 !important; }
.row_form p { padding: 10px; }
.inputfield { height: calc(100% + 19px); }
.sty__join_link.pd__subslide { margin: 60px 0; }
.padding_maincontent { padding: 20px 0; }
.sec__upcoming .box_sd .detail .pth_content strong { font-size: 18px; }
.sec__upcoming .box_sd .detail .pth_content .sqs-html-content li p strong { font-size: 16px; }
.list-amenities li { margin: 40px; }
.sec__offercontactus form .-submit p { padding-top: 50px; }
.sty__join_link .btn__booknow { border-radius: 40px !important; font-size: 16px !important; }
.wrap-entry-blog article .entry-intro .entry-image img { height: 100%; object-fit: cover; }
table.tablepress tbody tr td { font-size: 14px; }

/* FOOTER */
.site-footer-v2 { background-color: var(--primary-color); color: var(--white-color); font-family: var(--primary-font); }
.site-footer-v2 p { padding: 0; }
.footer-v2-main { padding: 80px 0; }
.footer-v2-flex { display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1024px; margin: 0 auto; }
.footer-v2-col-left { flex: 0 0 45%; max-width: 45%; display: flex; flex-direction: column; text-align: left; }
.footer-v2-logo { margin-bottom: 20px; }
.footer-v2-logo img { max-width: 60px; height: auto; filter: brightness(0) invert(1); }
.footer-v2-contact-list .contact-item { margin-bottom: 20px; }
.footer-v2-contact-list h4 { font-family: var(--primary-font) !important; font-size: 20px; font-weight: 400; color: var(--white-color) !important; text-transform: uppercase; letter-spacing: 1px; margin: 0; padding: 0; }
.footer-v2-contact-list p,
.footer-v2-contact-list a { font-family: var(--primary-font) !important; font-size: 16px; font-weight: 200; color: var(--white-color) !important; text-decoration: none; margin: 0; line-height: 1.6; }
.footer-v2-contact-list a:hover { opacity: 0.7; }
.footer-v2-col-right { flex: 0 0 45%; max-width: 45%; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.newsletter-title { font-family: var(--primary-font) !important; font-size: 36px !important; font-weight: 400; color: var(--white-color) !important; text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 15px; }
.newsletter-desc { font-family: var(--primary-font); font-size: 16px; font-weight: 200; color: var(--white-color); margin-bottom: 30px; line-height: 1.6; }
.newsletter-form-wrap form { width: 100%; max-width: 400px; margin: 0 auto; text-align: left; }
.newsletter-form-wrap label { gap: 20px; display: flex; flex-direction: column; font-family: var(--primary-font); font-size: 14px; font-weight: 200; color: var(--white-color); margin-bottom: 8px; }
.newsletter-form-wrap input[type="text"],
.newsletter-form-wrap input[type="email"] {
    width: 100%;
    padding: 12px 20px;
    border-radius: 30px;
    border: none;
    background-color: #f7f5f0;
    font-family: var(--primary-font);
    font-size: 14px;
    color: var(--black-color);
    margin-bottom: 20px;
    box-sizing: border-box;
    outline: none;
}
.newsletter-form-wrap input[type="submit"] {
    background-color: transparent !important;
    border: none;
    color: var(--white-color);
    font-family: var(--primary-font);
    font-size: 20px !important;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    cursor: pointer;
    display: block;
    width: 100%;
    text-align: center;
    margin: 10px 0;
    transition: opacity 0.3s ease;
    text-decoration: none !important;
}
.newsletter-form-wrap input[type="submit"]:hover { opacity: 0.6; color: var(--white-color) !important; }
.footer-v2-bottom { background-color: var(--secondary-bg); padding: 15px 0; }
.footer-v2-bottom-flex { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; font-family: var(--primary-font); font-size: 14px; color: var(--primary-color); font-weight: 400; }

/* RESPONSIVE */
@media (max-width: 1280px) {
    .title-with-lines-right::before { width: calc(80% - 150px); }
    .title-with-lines-left::after { width: calc(70% + 140px); }
    .group-retreat-flex .title-with-lines-left::after { width: calc(20% - 25px); }
}
@media (max-width: 1024px) {
    #sec__wellness_facilities .sec-main-heading h2 { font-size: 32px; }
    .title-with-lines-left::after { width: calc(80% + 125px); }
    .title-with-lines h1::after { width: calc(100% + 205px); }
    .title-with-lines-right::before { width: calc(100% - 230px); }
    .program-content h3, .wellness_box2 h3 { font-size: 20px !important; line-height: 1.2 !important; }
    .sub-program-list a { font-size: 14px; }
    .wrap_description_room { width: 100% !important; padding-top: 0; padding-bottom: 0; }
    .wrap_description_room h2 { font-size: 36px; }
}
@media (max-width: 991px) {
    .title-with-lines { text-align: center; left: 0; right: 0; }
    .title-with-lines h1::before, 
    .title-with-lines h1::after { width: calc(100% - 20px); }
    .sty__4col_pillars { grid-template-columns: repeat(2, 1fr); }
    .sty__3col_programs { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .sty__3col_programs > div { grid-column: auto; }
    .sty__3col_programs > div:nth-child(7) { grid-column: auto; }
    .feature-flex-row { flex-direction: column; }
    .feature-left-media,
    .feature-right-content { flex: 0 0 100%; max-width: 100%; }
    .feature-title-wrap { align-self: flex-end; align-items: flex-start; text-align: left; }
    .title-with-lines-left::after { width: 405px; }
    .title-with-lines-right::before { width: 265px; }
    .wellness-swiper { border-radius: 30px 0 0; min-height: auto; }
    .feature-icon-bar-full { border-radius: 0 0 30px 30px; padding: 20px; margin-top: 0; } 
    .feature-right-content { padding: 40px 20px; top: 0; order: 1; }
    .accommodation-swiper { border-radius: 0 30px 0 0; }
    .icon-flex-scroll { justify-content: flex-start; }
    .group-retreat-flex .title-with-lines-left::after { width: calc(100% - 325px); }
    .retreat-content { flex: 0 0 100%; max-width: 100%; padding: 40px 20px 0; }
    .retreat-img { border-radius: 30px 30px 0 0; min-height: 250px; } 
    .retreat-buttons { justify-content: center; }
    .love-kitchen-content { max-width: 70%; padding: 40px; }
    #sec__special_offers .sdty__2slide { max-width: 768px; }
    .footer-v2-flex { padding: 0 30px; }
}
@media (max-width: 768px) {
    body { font-size: 14px !important; }
    body .sty__intro .title h1 { font-size: 36px !important; }
    body .sty__intro .title h2 { font-size: 20px !important; }
    body .sty__intro .title h3 { font-size: 16px !important; }
    body .pd__m_intro.intro-last { padding-bottom: 80px !important; }
    body .pd__m_intro.bg-dark {padding-bottom: 80px !important; }
    .detail { text-align: center; }
    .title-with-lines h1::before, .title-with-lines h1::after { display: none; }
    .sty__3col_programs { grid-template-columns: repeat(2, 1fr); }
    .program-card { aspect-ratio: auto; min-height: 500px; }
    .program-content { max-height: 200px; }
    .sub-program-list a { font-size: 14px; }
    .sub-program-list li { padding-bottom: 0; }
    #sec__wellness_facilities .sec-main-heading h2 { font-size: 32px; padding-top: 0; }
    .wellness-swiper, .accommodation-swiper { border-radius: 30px 30px 0 0; }
    .feature-title-wrap { width: 100%; }
    .title-with-lines-right { padding: 0; right: 0 ; width: 100%; display: flex; flex-direction: column; }
    .title-with-lines-right::before, .title-with-lines-right::after { display: none; }
    .title-with-lines-left { padding: 0; left: 0;}
    .title-with-lines-left::before, .title-with-lines-left::after { display: none; }
    .accommodation-title-wrap { width: 100%; }
    .title-with-lines-left { width: 100%; display: flex; flex-flow: column; }
    body .sty__intro .title h1,
    body .sty__intro .title h3 { text-align: center; padding-bottom: 10px !important; }
    .amenities-swiper { padding: 0 30px; }
    .amenities-swiper .swiper-button-next::after,
    .amenities-swiper .swiper-button-prev::after { font-size: 18px; }
    .amenities-swiper .swiper-button-next { right: 0px; }
    .amenities-swiper .swiper-button-prev { left: 0px; }
    .love-kitchen-wrapper { justify-content: center; min-height: 350px; }
    .love-kitchen-wrapper::before { background: none; }
    .love-kitchen-content { max-width: 100%; text-align: center; padding: 50px 20px; }
    .lk-title { font-size: 32px; width: 100%; }
    .group-retreat-flex { padding: 0; }
    .review-content-box { padding: 0 40px; }
    .review-content-box::before,
    .review-content-box::after { font-size: 60px; top: 20%; }
    .review-title { font-size: 36px; }
    #sec__awards { padding: 80px 0 !important; }
    .wellness_box2 h3 { font-size: 18px !important; }
    .footer-v2-col-left,
    .footer-v2-col-right { flex: 0 0 100%; max-width: 100%; text-align: center; }
    .footer-v2-contact-list h4,
    .newsletter-form-wrap form { text-align: center; }
    .newsletter-title { font-size: 32px !important; }
    .footer-v2-col-right { margin-top: 50px; padding-top: 50px; border-top: 1px solid rgba(255,255,255,0.2); }
    .footer-v2-bottom-flex { flex-direction: column; text-align: center; gap: 10px; }
    .sty__intro-boxlist h4 { display: flex; justify-content: center; }
    .sty__intro-boxlist .row:last-child { padding-bottom: 60px; }
    .sty__intro-boxlist .row:nth-child(even) .text:last-child { padding-right: 0; }
    .amenities .container .list-amenities { margin-bottom: 0; }
    .sec__listoffers .box .link { justify-content: center; }
    .sec__offercontactus form .-submit p { margin: 0; }
}
@media (max-width: 600px) {
    footer.site-footer-v2 { margin-bottom: 50px; }
}
@media (max-width: 575px) {
    body .pd__m_intro.bg-dark { padding-bottom: 60px !important; }
    body .pd__m_intro.intro-last { padding-bottom: 60px !important; }
    body .pd__m_intro.intro-extra { padding-bottom: 60px !important; }
    body .sty__intro .detail p { font-size: 16px !important; }
    #sec__wellness_facilities .sec-main-heading h2 { font-size: 28px; padding-bottom: 10px; }
    .icon-item span { font-size: 14px; }
    .sty__4col_pillars { grid-template-columns: 1fr; }
    .pillar-box { aspect-ratio: 16 / 9; }
    .sec-main-heading { margin-bottom: 30px; }
    .sty__3col_programs { grid-template-columns: 1fr; }
    .lk-subtitle span { font-size: 24px; }
    .lk-detail { font-size: 16px; }
    .btn-pill-outline-white { font-size: 16px; }
    .review-text { font-size: 16px; }
    #sec__special_offers .sdty__2slide { max-width: 480px; width: 360px; }
    #sec__special_offers .slick-dots { max-width: 250px; bottom: 0; }
    .sty__intro-boxlist .row { padding-top: 0; }
    .amenities .container h3 { font-size: 24px !important; }
    .footer-v2-main { padding: 60px 0; }
    .bg_fullImg_wrap.retreat { padding: 60px 0; }
    .wrap__maincontent-offers h1 { font-size: 36px !important; padding-bottom: 0; }
    .sec__offercontactus h3 { font-size: 24px; }
    .sec__offercontactus form .row p { font-size: 14px; }
    .sec__offercontactus form input { font-size: 14px; }
    .wrap-entry-blog article .entry-intro { display: flex; flex-direction: column; }
    .wrap-entry-blog article .entry-intro .entry-image { width: 100%; }
    .wrap-entry-blog article .entry-intro .entry-image img { object-fit: contain; }
    .wrap-entry-blog article .entry-intro .entry-content { width: 100%; }
    .wrap-entry-blog article .entry-intro h3 { font-size: 20px; }
}
@media (max-width: 430px) {
    #sec__wellness_facilities .sec-main-heading h2 { font-size: 24px; }
}
@media (max-width: 390px) {
    body p { font-size: 14px !important; }
    body .sty__intro .detail p { font-size: 14px !important; }
    .pillar-description .detail { font-size: 14px; }
    body .sty__intro .title h1 { font-size: 32px !important; }
    .program-content { max-height: 240px; }
    .program-content h3 { font-size: 18px; }
    .sec-main-heading p { font-size: 14px; }
    .detail-text p { font-size: 14px; }
    .review-text { font-size: 14px; }
    .footer-v2-contact-list h4 { font-size: 18px; }
    .footer-v2-contact-list p, .footer-v2-contact-list a { font-size: 14px; }
    .newsletter-title { font-size: 24px !important; }
    .newsletter-desc { font-size: 14px; }
    .newsletter-form-wrap input[type="submit"] { font-size: 14px !important; }
    .footer-v2-bottom-flex { font-size: 12px; }
    .content_section .wrap_container h2 { font-size: 32px; }
    .table_awards td { font-size: 14px; }
    #experiences .box_detail h3 { font-size: 20px; }
    .wrap_container h1 { font-size: 32px; }
    strong.title { margin-bottom: 0; }
    .select_wellness_programs h3 strong.title { font-size: 32px; }
    .amenities .container h3 { font-size: 20px !important; }
    .list-amenities li { margin: 20px; }
}