/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
html, body {
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

@font-face {
font-family: 'MyFont';
src: url('/wp-content/themes/flatsome-child/assets/fonts/BeautiqueDisplay-Regular.woff') format('woff');
font-weight:400;
font-style:normal;
font-display:swap;
}


/*footer*/
#footer{
	background-image:url(/wp-content/themes/flatsome-child/assets/images/footer-background.png);
	background-color:rgba(177, 143, 79, 0.05);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: right;
}

.wa__btn_popup_txt{display: none !important;}
a.btn-outline {
    border: solid 1px #B18F4F;
    color: #B18F4F;
    padding: 1em 2.5em;
    border-radius: 99px;
    background: #fff;
    line-height: 0;
}

.absolute-footer{
	display: none;
}
.absolute-footer-link{
	list-style: none; 
	padding: 0; 
	margin: 0;
}
.absolute-footer-link li{
	display: inline;
}
#footer .section{
	padding-bottom: 0 !important;
}
.footer-copyright {
    border-top: solid 1px #dedede;
    padding-top: 15px;
}
.footer-copyright .col{
	padding-bottom: 15px !important;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu{
	border-radius: 8px !important;
	background-color: #f1f1f1b5 !important;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link{
	background: none !important;
}

@media (min-width: 768px){

.footer-link .col-inner{
	display:flex;
	justify-content:center;
	gap:80px;
	padding-left:0;
}

.footer-link ul{
	list-style:none;
	padding:0;
	margin:0;
	display:flex;
	flex-direction:column;
	gap:32px;
}

.footer-link li{
	font-weight:700;
	font-size: 1.125em;
	margin-bottom: 0 !important;
}

}

.snera-footer{
display:flex;
flex-direction:column;
}

.footer-logo img{
max-width:250px;
margin-bottom: 2em;
}

.footer-info{
display:flex;
flex-direction:column;
gap:18px;
}

.info-row{
display:flex;
align-items:center;
}

.info-icon{
width:24px;
height:24px;
margin-right:10px;
flex-shrink:0;
}

.info-contact{
gap:40px;
}

.contact-item{
display:flex;
align-items:center;
}


/*Contact page */
.contact_form7 .section-content{
	width: 50%;
}

.contact-section{
	padding-top: 182px !important;
}

.form-contact,.glass{
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-radius: 16px;
	border: 1px solid rgba(255,255,255,0.2);
	box-shadow: 0 8px 32px rgba(0,0,0,0.2);
	padding: 40px 80px;
}

.glass{
	margin-top: 182px;
}

.glass h1.page-title{
	color: #fff;
	font-size: 3rem;
	margin-bottom: 24px;
}
.glass h3.thin-font{
	color:#fff;
}
.glass .searchform button{display:none;}
.glass .searchform-wrapper{max-width:320px !important;}
.glass input.search-field{
	margin-top:24px;
	background-color:#fff !important;
	border-radius: 8px !important;
	padding: 30px 40px !important;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:16px center;
}

.form-contact .col{
	padding: 0px 15px 0px;
}
.form-contact label{
	color: #fff;
	font-weight: 300;
}

.form-contact input, .form-contact textarea{
	padding: 1em;
	font-size: .75em;
	color: rgba(21, 43, 28, 0.3) !important;
	border-radius: .5em;
	line-height: 150%;
	height: unset;
}

.form-contact input.submit{
	color: #fff !important;
	text-transform: unset !important;
	font-size: 1em !important;
}

.form-contact textarea{
	height: 85px !important;
	min-height: 85px !important;
}

h1.page-title{
	font-family:'MyFont',sans-serif;
	font-size: 3em;
	font-weight: 400 !important;
}

.form-contact h1{
	color: #fff;
	text-align: center;
}

/*Press and Blogs*/
h2.page-subtitle{
	font-family:'MyFont',sans-serif;
	font-size: 2em;
	font-weight: 400 !important;
	padding-top: 40px;
	padding-bottom: 24px;
}

.pcp-date, .cap-date{
	font-size: 14px !important;
	font-weight: 500;
	line-height: 20px;
}

.page-id-51 #main{
    background-image:url("https://sneragroup.vn/wp-content/uploads/2026/03/Press-2.svg");
	background-size: cover;
	background-position: bottom;
}



.heading-2, .sub-tittle{
	font-size: 3rem;
	color: #152B1C;
	font-family:'MyFont',sans-serif; 
	font-weight: 300;
}



/*Our Philosophy*/
.container, .row{
	max-width: 89vw !important;
}

.our-philosophy:not(:first-child){
	aspect-ratio: 14 / 7;
	max-height: 700px;

}

.our-philosophy:first-child{
	padding: 80px 0px;
	width: 50%;
	text-align: center;
	display:flex;
	flex-direction:column;
	justify-content:center;
}

.our-philosophy .label{
	font-size: 1.5em;
}

.vision .content, .mission .content, .model .content{
	width:50%;
	display: flex;
	flex-direction: column;
}

.culture .content{
	width:41%;
}

.our-philosophy h3{
	font-size: 3em;
	font-family:'MyFont',sans-serif;
	font-weight: 300;
	margin-bottom: 0;
}

.our-philosophy p{
	font-size: 18px;
}

.travel-grid{
display:flex;
margin:auto;
flex-direction: column;
align-items: center;
position: relative;
}

.luxury-travel{
padding:80px 0;
position:relative;
background-size: cover !important;
background-image: url(https://sneragroup.vn/wp-content/uploads/2026/03/Frame-1000004292.svg);
background-position: 100% 30%;
}

.travel-grid .vision, .travel-grid .culture {
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.illus-hat{
position:absolute;
right:8%;
top:10%;
width:42%;
opacity:.9;
}

.travel-grid .mission, .travel-grid .model{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items: flex-end
}

.travel-grid a.btn-outline{
	border: solid 1px #B18F4F;
	color: #B18F4F;
	padding: .75em 3em;
	border-radius: 99px;
	margin-top: 1.5em;
	background: #fff;
}

.model .content .dragonboat{
position:absolute;
left:8%;
bottom: 1%;
width:50%;
opacity:.9;
z-index: -1;
}

.cultural-image{
	position:absolute;
	right:5%;
	top:44%;
	width:50%;
	opacity:.9;
}

.guitar{
	position: absolute;
    left: 5%;
    top: 36%;
    width: 45%;
    opacity: .9;
}

.lantern{
	right: -2%;
	position: absolute;
	bottom:9%;
	width:42%;
	opacity:.9;
}

.noodles{
	position: absolute;
	left:20%;
	top:27%;
	width:25%;
	opacity:.9;
}

/*Why Vietnam*/

.partnership span {
  display: inline-block;
  border-left: 2px solid #b18f4f;
  padding-left: 14px;
  clip-path: inset(0 100% 0 0); /* ẩn hoàn toàn từ phải */
  transition: none;
}

.partnership_pathways.is-visible .partnership span {
  animation: wipeIn 0.8s cubic-bezier(0.77, 0, 0.18, 1) 0.5s forwards;
}

@keyframes wipeIn {
  to { clip-path: inset(0 0% 0 0); } /* reveal từ trái sang phải */
}

/* ===== FADE IN TỪNG STEP (sau khi overlay kết thúc) ===== */
.step-1 .step1,
.step-2 .step2,
.step-3 .step3 {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Delay lần lượt: 1.1s → 1.35s → 1.6s (sau khi animation overlay 1s xong) */
.partnership_pathways.is-visible .step-1 .step1 { opacity: 1; transform: translateY(0); transition-delay: 1.35s; }
.partnership_pathways.is-visible .step-2 .step2 { opacity: 1; transform: translateY(0); transition-delay: 1.6s; }
.partnership_pathways.is-visible .step-3 .step3 { opacity: 1; transform: translateY(0); transition-delay: 1.85s; }

.partnership_pathways{
	background-image:url(/wp-content/themes/flatsome-child/assets/images/1000004284.png);
	background-size: cover;
	background-repeat: no-repeat;
}

.step-1, .step-2{
	display: flex;
	flex-direction: row;
    justify-content: space-between;
}

.step-3{
	display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-content: flex-end;
    align-items: flex-end;
}
.step1, .step2, .step3{
	width: 20%;
	text-align: justify;
}



.partnership span{
	font-size: 3em;
	font-family: 'MyFont',sans-serif;
	color: #152B1C;
}

h4.step_title{
	text-transform: uppercase;
	color: #B18F4F;
	font-size: 2em;
	text-align: right !important;
	font-weight: 500;
}

.step-1 .step_title, .step-3 .step_title{
	text-align: right !important;
}

.step-2 .step_title{
	text-align: left !important;
}


.why-vietnam-page .homepage-item-2{
	position: relative;
	z-index: 2;
}

.why-vietnam-page .homepage-item-2::before{
	content:"";
	position:absolute;
	top: -150px;
	bottom: -150px;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	background: url("https://sneragroup.vn/wp-content/uploads/2026/03/Line-23.svg") center/cover no-repeat;
	z-index: 1;
	pointer-events: none;
}

.why-vietnam-page,
.why-vietnam-page .section-content,
.why-vietnam-page .row,
.why-vietnam-page .col {
	overflow: visible !important;
}

.why-vietnam-page .homepage-item-1,
.why-vietnam-page .homepage-item-3 {
	position: relative;
	z-index: 3;
}

.why-vietnam-page .homepage-item-2 .col-inner{
	position: relative;
	z-index: 1;
}

.why-vietnam-page .homepage-item-1{
	position: relative;
	z-index: 2;
}

.why-vietnam-page .homepage-item-1::before{
	content:"";
	position:absolute;
	top: 0px;
	bottom: -150px;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	background: url("https://sneragroup.vn/wp-content/uploads/2026/03/Component-32-2.svg");
	background-size: contain;
	background-repeat: no-repeat;
	pointer-events: none;
}

.hero_statement{
	padding: 10em 0;
	text-align: center;
}
.hero{
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: column;
}

    /*
      Mỗi section: aspect-ratio 16/10 → height = 62.5vw
      Vị trí căn giữa viewport: top = 50vh - 31.25vw
      Overlap offset giữa các section: 22% of width = 22vw

      Các section xếp chồng nhau theo thứ tự:
        section[0] active  → top = CENTER
        section[1] waiting → top = CENTER + (62.5vw - 22vw) = CENTER + 40.5vw  (overlap -22% so với section[0])
        section[2] waiting → top = CENTER + 2*(40.5vw)

      Khi chuyển sang section[1]:
        section[0] → thoát lên trên: top = -62.5vw
        section[1] → di chuyển đến CENTER
        section[2] → di chuyển đến CENTER + 40.5vw
    */

    /* ── WRAPPER: cửa sổ 100vh ── */
    .why-wrapper {
      position: relative;
      width: 100%;
      height: 100vh;
      overflow: hidden;
      background-image:url(/wp-content/themes/flatsome-child/assets/images/image_38.png);
    }

    /* ── MỖI SECTION ── */
    .why-section {
      position: absolute;
      left: 0;
      width: 100%;
      aspect-ratio: 16 / 10;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      display: flex;
      align-items: center;
      transition: top 0.85s cubic-bezier(0.76, 0, 0.24, 1);
    }

    /* ── NỘI DUNG ── */
    .why-content {
      width: 45%;
      padding: 5% 6%;
      position: relative;
      z-index: 3;
    }

    .why-content h2 {
      font-size: clamp(1.6rem, 3vw, 2.4rem);
      font-weight: 400;
      font-style: italic;
      color: #1a1a1a;
      margin-bottom: 1rem;
    }

    .why-content p {
      font-size: clamp(0.8rem, 1.3vw, 1rem);
      color: #3a3a3a;
      line-height: 1.8;
      text-align: justify;
    }

    /* ── BG + vị trí text ── */
    .why-vietnam {
      background-image: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/why_vietnam_bg.png");
      justify-content: flex-end;
    }
    .why-us {
      background-image: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/why_us_bg.png");
      justify-content: flex-start;
    }
    .why-now {
      background-image: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/why_now_bg.png");
      justify-content: flex-end;
    }


/*Our team*/
.our-team .box-image{
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}

.our-team .box-text{
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
	background: #D9D9D9;
	padding: 16px;
}

.our-team .box-text .team-name{
	font-size: 24px;
	font-weight: 400;
}

.our-team .box-text .team-title{
	font-size: 18px;
	font-weight: 300;
}

.our-team .box-text .team-description{
	font-size: 14px;
	font-weight: 300;
}



/* Card chính */
.impress-number .col{
	padding-bottom: 0;
}

.impress-card {
  position: relative;
  border-radius: 30px;
  overflow: visible;
  background: #fff;
}

.impress-card > * {
  position: relative;
  z-index: 1;
}

/* Lớp nền phía sau (bóng be lệch) */
.impress-card::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 100%;
  height: 100%;
  background: #e5dccb;
  border-radius: 30px;
  z-index: 0;
}

/* Phần trên */
.impress-card-top {
  background: #f2f2f2;
  padding: 16px 24px;
  text-align: center;
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  border: 2px solid #3f5448;
}

.impress-card-top h2 {
  margin: 0;
  font-size: 48px;
  color: #0f2d1f;
  font-weight: 800;
}

/* Phần dưới */
.impress-card-bottom {
  background: #4b5f53;
  padding: 16px 24px;
  text-align: center;
  border-bottom-left-radius: 24px;
	border-bottom-right-radius: 24px;
}

.impress-card-bottom p {
  margin: 0;
  color: #fff;
  letter-spacing: 2px;
  font-size: 16px;
}

.suffix {
  font-size: 23px;
  vertical-align: super;
  margin-left: 5px;
}

.services-header {
  display: inline-block;
  background: rgba(21, 43, 28, 0.8);
  color: #fff;
  padding: 10px 20px;
  border-radius: 10px 10px 0 0;
  margin-left: 2.5%;
}

.section-services{
	border-top: solid 2px rgba(21, 43, 28, 0.8);
	background: rgba(177, 143, 79, 0.05);
	padding: 40px 0 !important;
	margin-bottom: 30px;
}

.gallery-header {
  display: block;
  width: fit-content;
  margin-left: auto;
  background: rgba(21, 43, 28, 0.8);
  color: #fff;
  padding: 10px 32px;
  border-radius: 10px 10px 0 0;
  margin-right: 2.5%;

}

.section-gallery{
	border-top: solid 2px rgba(21, 43, 28, 0.8);
	padding-top: 4px !important;
}

.retreat-intro{
	padding: 10em !important;
}

.retreat-intro .col-inner{
	display: flex;
	flex-direction:row;
	justify-content:center;
	gap: 160px;
	align-items: center;
}

.intro-content{
	display: flex;
	flex-direction: column;
    gap: 16px;
	align-items: flex-start;
}

.retreat-title{
	font-size: 3em;
	font-family:'MyFont',sans-serif;
	color: #152B1C;
	line-height: 1em;
}

.intro-content .label{
	font-size: 24px;
	color: rgba(21, 43, 28, 0.3);
}

.intro-content .description{
	color: rgba(21, 43, 28, 0.7);
}

.page-id-45 .row.row-full-width, .page-id-43 .row.row-full-width, .page-id-47 .row.row-full-width, .page-id-49 .row.row-full-width{
	max-width: 100% !important;
}

.intro-content .btn_outline{
	border: solid 1px #B18F4F;
	color: #B18F4F;
	padding: 1em 2.5em;
	border-radius: 99px;
	background: #fff;
	line-height: 0;
}

.page-id-45 #main, .page-id-43 #main, .page-id-47 #main, .page-id-49 #main{
    background-image:url("https://sneragroup.vn/wp-content/uploads/2026/03/Press-2.svg");
	background-position: center 680px;
    background-repeat: no-repeat;
    background-size: cover;
}

.home-hero{
	height: 100vh !important;
}



/*Responsive*/
@media (max-width: 767px) {
	.glass h1.page-title{
		font-size: 2em;
	}
	
	.container, .row{
		max-width: 100vw !important;
	}
	
	.retreat-intro{
		padding: 1em !important;
	}
	
	.retreat-intro .col-inner{
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 1em;
		align-items: center;
	}
	
	.mobile-banner img{
		height:100vh;
		width: auto;
        max-width: fit-content;
	}
	
	.our-philosophy {
		height: 100vh;
		padding: 80px 2em;
		width: 100% !important;
		text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: flex-start !important;
	}
	
	.our-philosophy h3{
		font-size: 2em;
	}
	
	.philosophy{
		background: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/philosophy.png");
		background-position: bottom;
        background-repeat: no-repeat;
	}
	
	.vision{
		background: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/our-vision.png");
		background-position: bottom;
        background-repeat: no-repeat;
	}
	
	.mission{
		background: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/Mission.png");
		background-position: bottom;
        background-repeat: no-repeat;
	}
	
	.cultural{
		background: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/Cultural.png");
		background-position: bottom;
        background-repeat: no-repeat;
	}
	
	.luxury-travel{
		background: url("https://sneragroup.vn/wp-content/themes/flatsome-child/assets/images/Luxury-travel.png");
		background-position: bottom;
        background-repeat: no-repeat;
	}
	
	.carousel-track-row {
	  display: flex;
	  overflow: hidden;
	  transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
	  will-change: transform;
	}
	
	.our-philosophy-section {
	  min-width: 100vw;
	  height: 100vh;
	  flex-shrink: 0;
	}
}