:root {
  --font-primary-regular: "roboto-regular";
  --font-primary-thin: "roboto-thin";
  --font-primary-light: "roboto-light";
  --font-primary-medium: "roboto-medium";
  --font-primary-semiBold: "roboto-semiBold";
  --font-primary-bold: "roboto-bold";
  --font-primary-black: "roboto-black";
  --font-millanova: "millanova";
  --White: #fff;
  --Foundation-Green-green-500: #79B342;
  --gray-9---body-text: #262626;
  --Foundation-Green-green-100: #D5E7C4;
  --Grey-9: #090C13;
  --gray-4---stroke: #D8D8D8;
  --Title: #023F43;
  --gray-6---subtle-text: #8C8C8C;
  --Foundation-Green-green-700: #567F2F;
  --gray-8: #434343;
  --Foundation-Green-green-50: #F2F7EC;
  --gray-7: #595959;
}

/* font */

@font-face {
  font-family: "roboto-regular";
  src: url(../font/Roboto/Roboto-Regular.ttf);
}

@font-face {
  font-family: "roboto-light";
  src: url(../font/Roboto/Roboto-Light.ttf);
}

@font-face {
  font-family: "roboto-medium";
  src: url(../font/Roboto/Roboto-Medium.ttf);
}

@font-face {
  font-family: "roboto-semiBold";
  src: url(../font/Roboto/Roboto-SemiBold.ttf);
}

@font-face {
  font-family: "roboto-bold";
  src: url(../font/Roboto/Roboto-Bold.ttf);
}

@font-face {
  font-family: "roboto-black";
  src: url(../font/Roboto/Roboto-Black.ttf);
}

@font-face {
  font-family: "millanova";
  src: url(../font/millanova/Millanova.ttf);
}

label {
  font-weight: unset !important;
}

body {
  font-family: var(--font-primary-regular);
  font-size: 16px;
  line-height: 24px;
  color: var(--gray-9---body-text);
}

.text-white {
  color: var(--White) !important;
}

.text-red {
  color: #DC1F26 !important;
}

.text-green {
  color: var(--Foundation-Green-green-500) !important;
}

.text-center {
  text-align: center !important;
}

.sec-56 {
  padding: 56px 0;
}

a {
  text-decoration: none !important;
}

p:not(.editor-content p),
h1:not(.editor-content h1),
h2:not(.editor-content h2),
h3:not(.editor-content h3),
h4:not(.editor-content h4),
h5:not(.editor-content h5),
h6:not(.editor-content h6) {
  margin: 0;
}

.editor-content p {
  margin: 16px 0;
}

h3 {
  font-size: 24px;
  line-height: 32px;
}

.header-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding: 8px 0;
  z-index: 999;
  background: transparent;
  transition: all 0.3s ease-in-out;
}

.header-container.fixed,
body:has(.header-fix) .header-container {
  background: var(--White);
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.10);
}

.overlay-header,
.btn-header-mobile {
  display: none;
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(95%, 1320px);
  margin: 0 auto;
}

.main-container {
  background-color: var(--White);
  min-height: 100vh;
}

.main-menu {
  display: flex;
  width: max-content;
  gap: 36px;
  padding: 16px 40px;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.20);
  backdrop-filter: blur(12px);
}

.header-container.fixed .main-menu,
body:has(.header-fix) .header-container .main-menu {
  background: var(--White);
  backdrop-filter: blur(12px);
}

.header-menu {
  list-style: none;
  display: flex;
  gap: 36px;
  margin: 0;
  padding: 0;
  align-items: center;
}

.header-menu>li {
  display: flex;
  align-items: center;
  gap: 6px;
  position: relative;
}

.header-menu>li i {
  font-size: 12px;
  font-weight: 600;
  color: var(--White);
  margin-top: -4px;
  transition: all 0.5s ease-in-out;
}

.header-menu>li>a,
.header-menu>li>span,
.header-menu>li .sub-menu li a {
  color: var(--White);
  font-size: 16px;
  line-height: 24px;
  display: flex;
  padding: 4px 1px;
  align-items: center;
  transition: all 0.3s ease-in-out;
  color: var(--White);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  position: relative;
}

.header-container.fixed .header-menu>li>a,
.header-container.fixed .header-menu>li>span,
.header-container.fixed .header-menu>li i,
.header-container.fixed .header-menu>li .sub-menu li a,
body:has(.header-fix) .header-container .header-menu>li>a,
body:has(.header-fix) .header-container .header-menu>li>span,
body:has(.header-fix) .header-container .header-menu>li i,
body:has(.header-fix) .header-container .header-menu>li .sub-menu li a {
  color: var(--gray-9---body-text);
}

.header-menu>li>a::after,
.header-menu>li>span::after {
  content: "";
  position: absolute;
  bottom: 4px;
  width: 100%;
  left: 0;
  transform: scaleX(0);
  transform-origin: center;
  opacity: 0;
  height: 2px;
  background-color: var(--Foundation-Green-green-500);
  transition: all 0.3s ease-in-out;
}

.header-menu>li:hover>a::after,
.header-menu>li:hover>span::after,
.header-menu>li.active>a::after,
.header-menu>li.active>span::after {
  transform: scaleX(1);
  opacity: 1;
}

.header-menu>li .sub-menu {
  position: absolute;
  top: 52px;
  left: 0;
  width: max-content;
  min-width: 150px;
  padding: 12px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  list-style: none;
  background-color: var(--White);
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.10);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out;
}

.header-menu>li:hover i {
  transform: rotate(180deg);
}

.header-menu>li .sub-menu::after {
  content: "";
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 30px;
  background-color: transparent;
}

.header-menu>li:hover .sub-menu {
  opacity: 1;
  visibility: visible;
}

.header-menu>li .sub-menu li a {
  color: var(--gray-9---body-text);
  padding: 0;
  display: flex;
  align-items: center;
  border: none;
  transition: all 0.3s ease-in-out;
}

.header-menu>li .sub-menu li:hover a {
  color: var(--Foundation-Green-green-500) !important;
  padding-left: 4px;
}

.main-menu>.line {
  width: 1px;
  height: 24px;
  background: rgba(255, 255, 255, 0.20);
  transition: all 0.3s ease-in-out;
}

.header-container.fixed .main-menu>.line,
body:has(.header-fix) .header-container .main-menu>.line {
  background: var(--gray-9---body-text);
}

.header-search .search-icon img {
  transition: all 0.3s ease-in-out;
}

.header-container.fixed .header-search .search-icon img,
body:has(.header-fix) .header-container .header-search .search-icon img {
  filter: brightness(0) invert(0);
}

.footer-container {
  position: relative;
}

.footer-main {
  width: 100%;
  min-height: 600px;
  position: relative;
}

.footer-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.footer-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.footer-container .container {
  position: relative;
  z-index: 1;
}

.footer-inner {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 32px 0;
}

.footer-first {
  display: flex;
  width: 364px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex-shrink: 0;
}

.footer-first-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 364px;
}

.footer-first-info .desc {
  color: var(--White);
  opacity: 0.6;
}

.footer-first-info .item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.footer-first-info .item .value {
  color: var(--White) !important;
}

.footer-menu {
  min-width: 160px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-menu li span {
  color: var(--White);
  font-family: var(--font-primary-semiBold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
}

.footer-menu li a {
  color: var(--White) !important;
}

.footer-menu li:has(span) {
  margin-bottom: 12px;
}

.footer-last {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 56px;
}

.footer-last .footer-follow {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  align-self: stretch;
}

.footer-last .footer-follow .title {
  color: var(--White);
  font-family: var(--font-primary-semiBold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
}

.footer-follow .items {
  display: flex;
  align-items: center;
  gap: 20px;
}

.banner-home .banner-item {
  position: relative;
  width: 100%;
  height: 918px;
}

.banner-home .banner-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.banner-item::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(1deg, rgba(0, 0, 0, 0.80) 1.12%, rgba(0, 0, 0, 0.00) 48.85%);
}

.banner-content {
  position: absolute;
  left: 0;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}

.banner-content .banner-text {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
}

.banner-content .banner-text .main-title {
  width: min(100%, 680px);
}

.main-title {
  color: var(--Grey-9);
  font-family: var(--font-primary-bold);
  font-size: 44px;
  font-style: normal;
  line-height: 52px;
}

.breadcrumb {
  margin: 0;
  padding: 0;
  background-color: transparent;
  display: flex;
  align-items: center;
  gap: 8px;
}

.breadcrumb>li+li:before {
  display: none;
}

.breadcrumb>li a {
  color: var(--White) !important;
  font-size: 14px;
}

.breadcrumb>li i {
  font-size: 12px;
  font-weight: 500;
  color: var(--White);
}

.breadcrumb>li span {
  color: var(--Foundation-Green-green-100);
  font-size: 14px;
}

.main-content {
  padding: 32px 0 56px 0;
}

.contact-inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.contact-header {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.contact-body {
  display: flex;
  width: 100%;
  align-items: stretch;
  gap: 30px;
}

.contact-body .contact-map {
  flex: 1;
  border-radius: 16px;
  overflow: hidden;
}

.contact-form {
  flex: 1;
  display: flex;
  padding-left: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 52px;
}

.contact-form .item {
  width: 100%;
  height: 70px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  border-radius: 16px;
  border: 2px solid var(--Foundation-Green-green-500);
  padding: 16px 24px;
  gap: 8px;
}

.contact-form .item .item-header {
  display: inline-flex;
  padding: 0 24px 0 8px;
  justify-content: center;
  align-items: center;
  gap: 16px;
  background: var(--White);
  margin-top: -40px;
}

.contact-form .item .item-header .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-semiBold);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.contact-form .item .value {
  color: var(--gray-9---body-text) !important;
  font-size: 18px;
}

.contact-form-container {
  position: relative;
  padding: 32px 0;
}

.contact-form-container .contact-form-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.contact-form-container .contact-form-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.contact-form {
  width: min(95%, 631px);
  padding: 32px 24px;
  border-radius: 4px;
  background: var(--White);
  backdrop-filter: blur(16px);
  margin: 0 auto;
}

.contact-form .row {
  margin: 0 -8px;
}

.contact-form .row>* {
  padding: 0 8px;
}

.contact-form .title {
  margin-bottom: 24px;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.contact-form .form-item {
  margin-bottom: 16px;
}

.contact-form .form-item label {
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  font-weight: unset;
  line-height: 24px;
}

.contact-form .form-item label .required {
  color: #DC1F26 !important;
}

.contact-form .form-item .form-control {
  display: flex;
  min-height: 44px;
  padding: 10px 16px;
  align-items: center;
  gap: 8px;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--gray-4---stroke);
  outline: none;
  box-shadow: none;
  transition: all 0.3s ease-in-out;
  resize: none;
}

.contact-form .form-item .form-control:hover,
.contact-form .form-item .form-control:focus {
  border-color: var(--Foundation-Green-green-500);
}

.contact-form .form-item .form-control::placeholder {
  color: #8C8C8C;
}

.contact-form .form-button {
  margin-top: 8px;
}

.btn-color-green {
  display: flex;
  width: 200px;
  height: 40px;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  border-radius: 4px;
  background: var(--Foundation-Green-green-500);
  color: var(--White) !important;
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  border: none;
}

.footer-form-container {
  display: flex;
  height: 122px;
  padding: 28px 0;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  background: #F3F4F3;
}

.footer-form-container .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.footer-form-container .container::after,
.footer-form-container .container::before {
  display: none;
}

.footer-form-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.footer-form-left .title {
  color: var(--Title);
  font-family: var(--font-primary-medium);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.footer-form-right form {
  width: 390px;
  height: 40px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  border-radius: 4px;
  border: 0.5px solid var(--Title);
  overflow: hidden;
}

.footer-form-right form input {
  flex: 1;
  padding: 6px 16px;
  border: none;
  outline: none;
}

.btn-send-email {
  width: 98px;
  height: 40px;
}

.faqs-container,
.terms-container,
.blog-container {
  padding: 72px 0;
}

.faqs-inner,
.terms-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  align-self: stretch;
}

.faqs-header {
  width: min(100%, 1000px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin: 0 auto;
}

.faqs-items {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.faqs-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  width: 100%;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--Foundation-Green-green-100);
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}

.faqs-item:hover,
.faqs-item.active {
  border-color: var(--Foundation-Green-green-500);
}

.faqs-item .faqs-item-header {
  display: flex;
  padding: 16px;
  align-items: center;
  gap: 16px;
  align-self: stretch;
}

.faqs-item .faqs-item-header .title {
  flex: 1;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.faqs-item .faqs-item-header .icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.faqs-item.active .faqs-item-header .icon {
  transform: rotate(180deg);
}

.faqs-item-content {
  max-height: 0;
  transition: all 0.3s ease-in-out;
  overflow: hidden;
  padding: 0 16px;
}

.faqs-item.active .faqs-item-content {
  max-height: 1000px;
  padding: 16px;
}

.terms-inner {
  align-items: flex-start;
  gap: 24px;
}

.blog-item {
  margin-bottom: 32px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.blog-item .blog-img {
  border-radius: 8px;
  box-shadow: 0 6px 25px 0 rgba(0, 0, 0, 0.15);
  overflow: hidden;
  height: 196px;
}

.blog-item .blog-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease-in-out;
}

.blog-item:hover .blog-img img {
  transform: scale(1.05);
}

.blog-item .blog-title {
  color: var(--Title) !important;
  font-family: var(--font-primary-semiBold);
  font-size: 18px;
  font-style: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  line-height: 26px;
  height: 78px;
}

.blog-item-style-2 {
  gap: 0;
}

.blog-item-style-2 .blog-img {
  border-radius: 8px 8px 0 0;
  box-shadow: none;
  height: 268px;
}

.blog-item-style-2 .blog-item-content {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
  align-self: stretch;
  background: #F3F4F3;
}

.blog-item .blog-item-content .time {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}

.blog-item .blog-item-content .time .value {
  color: var(--gray-6---subtle-text);
}

.blog-item.blog-item-style-2 .blog-item-content .blog-title {
  -webkit-line-clamp: 2;
  height: 52px;
}

.blog-item .blog-item-content .blog-link {
  color: var(--Foundation-Green-green-500) !important;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.blog-item-style-1 {
  height: 416px;
  width: 100%;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}

.blog-item-style-1 .blog-img {
  width: 100%;
  height: 100%;
}

.blog-item-style-1 .blog-item-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  padding: 24px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8px;
  background: linear-gradient(180deg, rgba(0, 36, 38, 0.00) 40.36%, rgba(0, 36, 38, 0.40) 50.01%, rgba(0, 36, 38, 0.90) 90.73%);
}

.blog-item-style-1 .blog-item-content .time img,
.blog-item-style-1 .blog-item-content .blog-link img {
  filter: brightness(0) invert(1);
}

.blog-item-style-1 .blog-item-content .time .value {
  color: var(--White) !important;
}

.blog-item-style-1 .blog-item-content .blog-title {
  color: var(--White) !important;
  -webkit-line-clamp: 2;
  height: 64px;
  font-size: 24px;
  line-height: 32px;
}

.blog-item-style-1 .blog-item-content .blog-link {
  color: var(--White) !important;
}

.pagination {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  margin: 0;
}

.pagination li a {
  width: 32px;
  height: 32px;
  background: var(--White);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(12px);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 4px;
  vertical-align: middle;
  color: #3F3F3F;
  font-family: var(--font-primary-regular);
  font-weight: unset;
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  transition: all 0.3s ease-in-out;
}

.pagination li a span img {
  filter: brightness(1) invert(0);
  transition: all 0.3s ease-in-out;
}

.pagination li:hover a span img {
  filter: brightness(0) invert(1);
}

.pagination li.active a,
.pagination li:hover a {
  background: var(--Foundation-Green-green-500);
  color: var(--White);
}

.main-container:has(.blog-details-container),
.main-container:has(.tours-container) {
  margin-top: 80px;
}

.wrapper-app:has(.banner-tour-detail){
  overflow-x: hidden;
}

.breadcrumb-container {
  padding: 8px 0;
  background: var(--Foundation-Green-green-700);
}

.breadcrumb-container .breadcrumb {
  width: min(95%, 1320px);
  margin: 0 auto;
}

.breadcrumb-container .breadcrumb li span {
  color: var(--White);
}

.breadcrumb-container .breadcrumb li+li span {
  color: var(--Foundation-Green-green-100);
}

.blog-detail-main {
  padding: 32px 0 60px 0;
  width: min(95%, 1320px);
  margin: 0 auto;
}

.other-blog-title {
  width: 100%;
  padding-top: 48px;
  border-top: 1px solid var(--Foundation-Green-green-500);
}

.other-blog-container {
  padding: 0 0 48px 0;
}

.other-blog-slider {
  margin-top: 32px;
}

.other-blog-slider .owl-stage-outer,
.team-slider .owl-stage-outer {
  margin: -20px;
  padding: 20px;
}

.other-blog-slider .blog-item {
  margin: 0;
}

.other-blog-slider .owl-next,
.other-blog-slider .owl-prev,
.team-slider .owl-next,
.team-slider .owl-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -64px;
}

.other-blog-slider .owl-next,
.team-slider .owl-next {
  left: auto;
  right: -64px;
}

.blog-detail-inner {
  display: flex;
  width: 100%;
  gap: 30px;
  align-items: flex-start;
}

.blog-detail-featured {
  display: flex;
  width: 277px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  flex-shrink: 0;
  position: sticky;
  top: 100px;
}

.blog-detail-featured .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.blog-detail-featured .blog-item {
  margin: 0;
}

.blog-detail-featured .blog-item .blog-img {
  height: 198px;
}

.blog-detail-post {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex-shrink: 0;
  max-width: 890px;
}

.blog-detail-share {
  display: flex;
  padding: 24px 10px 16px 10px;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  border-radius: 45px;
  background: rgba(246, 246, 246, 0.50);
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.10);
  width: 44px;
  position: sticky;
  top: 100px;
}

.blog-detail-share .title {
  transform: rotate(90deg);
  color: var(--subtext);
  height: 50px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}

.blog-detail-post {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 24px;
}

.blog-detail-post-header {
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 16px;
}

.blog-detail-post-header>.title {
  color: var(--Title);
  font-family: var(--font-primary-bold);
  font-size: 28px;
  font-style: normal;
  line-height: 36px;
}

.blog-detail-post-header .time {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: var(--gray-6---subtle-text);
}

.share-mobile {
  display: none;
  align-items: center;
  gap: 16px;
}

.editor-content {
  width: 100%;
}

.tag-blog {
  padding: 24px 0 8px 0;
  border-top: 1px solid rgba(216, 216, 216, 0.50);
  border-bottom: 1px solid rgba(216, 216, 216, 0.50);
  width: 100%;
  display: flex;
  padding-bottom: 8px;
  align-items: flex-start;
  gap: 16px;
}

.tag-blog .title {
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.tag-blog .tag-item {
  color: var(--gray-9---body-text) !important;
  display: flex;
  align-items: center;
  gap: 16px;
}

.tag-blog .tag-item+.tag-item::before {
  content: '/';
}

.about-us-box {
  display: flex;
}

.about-us-inner {
  padding: 56px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  position: relative;
}

.about-us-box-2 .about-us-inner {
  border-top: 1px solid #C1DCA8;
}

.about-us-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}

.about-us-content {
  width: 100%;
}

.about-us-video {
  width: 100%;
  height: 599px;
}

.about-us-box-3 {
  background-color: #F3F4F3;
}

.team-item {
  display: flex;
  width: 100%;
  height: 428px;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 8px;
  background: #FFF;
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.10);
  overflow: hidden;
  cursor: pointer;
}

.team-item-content {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  align-self: stretch;
  border-radius: 8px;
  background: #FFF;
  backdrop-filter: blur(5px);
}

.team-item-content .name {
  color: var(--Title);
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.position-experience {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
}

.position-experience>* {
  color: #FF9500;
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.team-item-content .desc {
  color: #434343;
  text-align: center;
  opacity: 0;
  transition: all 0.5s ease-in-out;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
}

.team-item-img {
  width: 100%;
  height: 342px;
  transition: all 0.5s ease-in-out;
}

.team-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
  overflow: hidden;
}

.team-item:hover .team-item-content .desc {
  opacity: 1;
}

.team-item:hover .team-item-img {
  height: 224px;
}

.value-towards {
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 134px;
}

.value-towards-item {
  display: flex;
  align-items: center;
  gap: 60px;
  position: relative;
}

.value-towards-item-line {
  position: absolute;
  left: 90px;
  bottom: -48%;
}

.value-towards-item:nth-child(even) .value-towards-item-line {
  transform: rotateY(180deg);
}

.value-towards-item:nth-child(even) {
  flex-direction: row-reverse;
}

.value-towards-item-img {
  flex: 1;
  border-radius: 8px;
  overflow: hidden;
}

.value-towards-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.value-towards-item-content {
  flex: 1;
  display: flex;
  align-items: flex-start;
  margin-top: 80px;
}

.value-towards-item-content .icon {
  display: flex;
  min-width: 180px;
  height: 180px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 180px;
  background: linear-gradient(180deg, rgba(255, 202, 8, 0.50) 0%, rgba(255, 202, 8, 0.00) 100%);
  margin-top: -52px;
  margin-right: -24px;
}

.value-towards-item-content .text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.value-towards-item-content .text .title {
  color: var(--Title);
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.tours-main-container {
  padding: 32px 0 72px 0;
}

.tours-main-inner {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.tours-main-header {
  display: flex;
  width: 1200px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.tours-main-header-first {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.tours-main-header-first-left {
  display: flex;
  align-items: flex-end;
  gap: 4px;
}

.tours-main-header-first-left .title {
  color: #191919;
  font-family: var(--font-primary-bold);
  font-size: 28px;
  font-style: normal;
  line-height: 32px;
}

.tours-main-header-first-left .count-tours {
  color: #191919;
  font-family: var(--font-primary-medium);
}

.tours-main-header-first-right {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.tours-main-header-first-right .select-sort {
  position: relative;
}

.select-sort-header {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.select-sort-header .title {
  color: var(--Title);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.select-sort-list {
  padding: 8px;
  list-style: none;
  position: absolute;
  top: 30px;
  width: max-content;
  right: 0;
  background-color: #fff;
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10);
  border-radius: 8px;
  z-index: 9999;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}

.select-sort-list.active {
  opacity: 1;
  visibility: visible;
}

.select-sort-list li {
  color: var(--Title);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  cursor: pointer;
  padding: 8px;
}

.tours-main-header-second {
  display: flex;
  align-items: center;
  gap: 16px;
  align-self: stretch;
}

.tours-main-header-second .btn-clear-tag {
  display: flex;
  width: 124px;
  padding: 0 8px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  cursor: pointer;
}

.tours-main-header-second .list-tag {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.tours-main-header-second .list-tag .tag-item {
  display: flex;
  height: 32px;
  padding: 0 8px 0 12px;
  align-items: center;
  gap: 4px;
  border-radius: 20px;
  border: 1px solid var(--gray-4---stroke);
  cursor: pointer;
  color: var(--gray-9---body-text);
  font-size: 14px;
  line-height: 22px;
}

.tours-main-content {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.tours-filter {
  display: flex;
  width: 278px;
  padding: 24px 16px;
  border-radius: 8px;
  border: 1px solid rgba(216, 216, 216, 0.50);
  background: #FFF;
  position: sticky;
  top: 100px;
}

.tours-list {
  flex: 1;
}

.tours-item {
  width: 100%;
  display: flex;
  padding-bottom: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 30px;
  cursor: pointer;
  border-radius: 8px;
  box-shadow: 0 6px 25px 0 rgba(0, 0, 0, 0.10);
}

.tours-item-img {
  border-radius: 4px 4px 0 0;
  height: 188px;
  overflow: hidden;
  position: relative;
}

.tours-item-img>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease-in-out;
}

.tours-item-location {
  display: inline-flex;
  height: 34px;
  padding: 6px 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 332px;
  background: rgba(0, 0, 0, 0.50);
  backdrop-filter: blur(16px);
  color: var(--White);
  font-family: var(--font-primary-medium);
  position: absolute;
  left: 12px;
  bottom: 12px;
}

.tours-item:hover .tours-item-img>img {
  transform: scale(1.05);
}

.tours-item-content {
  display: flex;
  padding: 0 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.tours-item-content .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.tours-item-content .first .rating {
  display: flex;
  height: 20px;
  align-items: center;
  gap: 4px;
}

.tours-item-content .first .rating .star {
  display: flex;
  align-items: center;
  gap: 2px;
  color: var(--gray-9---body-text);
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.tours-item-content .first .rating .count-rating {
  color: var(--gray-6---subtle-text);
}

.tours-item-content .first .title {
  overflow: hidden;
  color: var(--Title);
  text-overflow: ellipsis;
  font-family: var(--font-primary-semiBold);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 56px;
}

.tours-item-price {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  color: var(--gray-9---body-text) !important;
}

.tours-item-price>.title {
  color: var(--gray-6---subtle-text);
}

.tours-item-price>.value {
  color: #FF7226;
  font-family: var(--font-primary-bold);
  font-size: 22px;
  font-style: normal;
  line-height: 26px;
}

.tours-item-content>.line {
  width: 100%;
  height: 1px;
  background: var(--gray-4---stroke);
}

.tours-item-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.tours-item-info .item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: var(--gray-9---body-text) !important;
}

.tours-item-info .item .title {
  font-family: var(--font-primary-medium);
}

.tours-item-info .item .title {
  font-family: var(--font-primary-medium);
}

.btn-border-green {
  display: flex;
  height: 40px;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid var(--gray-4---stroke);
  color: var(--Foundation-Green-green-500) !important;
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
}

.tour-filter-inner {
  width: 100%;
}

.filter-tours {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.filter-tours .form-group {
  width: 100%;
  margin: 0;
  padding-bottom: 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.filter-tours .form-group:last-child {
  border: none;
  padding-bottom: 0;
}

.form-group-body {
  width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  max-height: 0;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  margin-top: -16px;
}

.form-group-body.active {
  margin-top: 0;
  max-height: 1000px;
}

.form-group-header {
  display: flex;
  align-items: center;
  gap: 16px;
  align-self: stretch;
}

.form-group:has(.form-group-body.active) .form-group-header .icon {
  transform: rotate(180deg);
}

.form-group-header {
  cursor: pointer;
}

.form-group-header .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  flex: 1;
}

.form-group-header .icon {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.filter-tours .form-group .form-item {
  width: 100%;
  margin: 0;
}

.filter-tours .form-group .form-item .form-control {
  display: flex;
  height: 40px;
  padding: 10px 8px 10px 30px;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid var(--gray-4---stroke);
  background: #F8F8F8;
  color: var(--gray-9---body-text);
  box-shadow: none;
  outline: none;
}

.filter-tours .form-group .form-item .form-control:hover,
.filter-tours .form-group .form-item .form-control:focus {
  border-color: var(--Foundation-Green-green-500);
}

.filter-tours .form-group .form-item .form-control {
  background-image: url('../img/icons/Calender.svg');
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-position: 8px center;
}

.filter-tours .form-group .form-item .form-control select {
  background: none;
  border: none;
  outline: none;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  background-image: url('../img/icons/CaretDown-2.svg');
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: right 2px top 1px;
  width: 100%;
  margin-top: 4px;
}

.filter-tours .form-group .form-group-body label.filter-item,
.deposit-haft label,
.regulations-instructions label {
  margin: 0;
  color: var(--gray-8);
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="checkbox"])::before,
.deposit-haft label:has(input[type="checkbox"])::before,
.regulations-instructions label:has(input[type="checkbox"])::before {
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 2px;
  border: 1px solid;
  border-color: var(--gray-4---stroke);
  transition: all 0.3s ease-in-out;
  margin-top: -2px;
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="checkbox"]):hover::before,
.deposit-haft label:has(input[type="checkbox"]):hover::before,
.regulations-instructions label:has(input[type="checkbox"]):hover::before {
  border-color: var(--Foundation-Green-green-500);
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="checkbox"])::after,
.deposit-haft label:has(input[type="checkbox"])::after,
.regulations-instructions label:has(input[type="checkbox"])::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 9px;
  border-right: 1px solid var(--White);
  border-bottom: 1px solid var(--White);
  top: 5px;
  left: 6px;
  transform: rotate(45deg);
  transition: all 0.3s ease-in-out;
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="checkbox"]:checked)::before,
.deposit-haft label:has(input[type="checkbox"]:checked)::before,
.regulations-instructions label:has(input[type="checkbox"]:checked)::before {
  border-color: var(--Foundation-Green-green-500);
  background-color: var(--Foundation-Green-green-500);
}

.filter-tours .form-group .form-group-body label.filter-item input[type="checkbox"],
.filter-tours .form-group .form-group-body label.filter-item input[type="radio"],
.regulations-instructions label input[type="checkbox"] {
  display: none;
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="radio"])::before,
.booking-form-item .form-item .radio-inline::before {
  content: "";
  width: 16px;
  height: 16px;
  border: 2px solid;
  border-color: var(--gray-4---stroke);
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
  margin-top: -2px;
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="radio"])::after,
.booking-form-item .form-item .radio-inline::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: transparent;
  position: absolute;
  top: 7px;
  left: 4px;
  transition: all 0.3s ease-in-out;
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="radio"]:checked)::before,
.booking-form-item .form-item .radio-inline:has(input[type="radio"]:checked)::before {
  border-color: var(--Foundation-Green-green-500);
}

.filter-tours .form-group .form-group-body label.filter-item:has(input[type="radio"]:checked)::after,
.booking-form-item .form-item .radio-inline:has(input[type="radio"]:checked)::after {
  background-color: var(--Foundation-Green-green-500);
}

.filter-tours .form-group .form-group-body label.filter-item span {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.banner-text .tours-item-location {
  position: relative;
  bottom: 0;
  left: 0;
}

.banner-text .tours-item-location img {
  width: 20px !important;
}

.tour-detail-header {
  height: 154px;
  padding: 24px 0;
}

.tour-detail-header .container {
  display: flex;
  align-items: center;
  gap: 30px;
}

.tour-detail-header .container::after,
.tour-detail-header .container::before {
  display: none;
}

.tour-detail-header-right {
  flex: 1;
  margin-top: -180px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.tour-detail-header-left {
  min-width: 688px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

.tour-detail-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.tour-detail-info .item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.tour-detail-info .item .title {
  width: 72px;
}

.tour-detail-info .item .value {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-family: var(--font-primary-medium);
}

.tour-detail-header-left .line {
  width: 1px;
  height: 106px;
  background: #D8D8D8;
}

.tour-detail-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.tour-detail-actions>a,
.tour-detail-actions>div {
  width: 160px;
  height: 48px;
  cursor: pointer;
}

.tour-detail-price {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 4px;
}

.tour-detail-price .title {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: var(--gray-9---body-text);
  font-size: 18px;
  line-height: 26px;
}

.tour-detail-price .price-discount {
  color: var(--Title);
  font-family: var(--font-primary-black);
  font-size: 28px;
  font-style: normal;
  line-height: 32px;
}

.tour-detail-price .price-discount .until {
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-regular);
  font-size: 18px;
  line-height: 26px;
}

.tour-detail-price .price {
  color: var(--gray-6---subtle-text);
  font-size: 18px;
  line-height: 26px;
  text-decoration-line: line-through;
}

.tour-detail-slider-item {
  width: 340px;
  height: 230px;
  border-radius: 8px;
  overflow: hidden;
}

.tour-detail-slider-item a {
  width: 100%;
  height: 100%;
}

.tour-detail-slider-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tour-detail-slider-nav {
  display: flex;
  align-items: flex-start;
  gap: 0;
}

.tour-detail-slider-nav-item {
  cursor: pointer;
}

.tour-detail-content {
  padding: 32px 0px 72px 0px;
  align-self: stretch;
  background: #F3F4F3;
}

.tour-detail-inner {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.tour-detail-inner-left {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  position: sticky;
  top: 100px;
}

.tour-detail-inner-right {
  display: flex;
  width: 277px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: sticky;
  top: 100px;
}

.tour-detail-inner-right-first {
  width: 100%;
  height: 180px;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
}

.tour-detail-inner-right-first .btn-zoom {
  position: absolute;
  bottom: 8px;
  right: 8px;
}

.tour-detail-menu {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  border-radius: 8px;
  background: var(--White);
}

.tour-detail-menu-item {
  width: 100%;
  display: flex;
  padding: 4px;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  color: #595959;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}

.tour-detail-menu-item img {
  filter: brightness(5) invert(2);
  opacity: 0.6;
  transition: all 0.3s ease-in-out;
}

.tour-detail-menu-item:hover,
.tour-detail-menu-item.active {
  color: var(--Foundation-Green-green-500);
}

.tour-detail-menu-item:hover img,
.tour-detail-menu-item.active img {
  filter: brightness(1) invert(0);
  opacity: 1;
}

.tour-detail-menu-item:not(:last-child) {
  padding-bottom: 16px;
  border-bottom: 1px solid #ECECEC;
}

.tour-detail-left-item {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  border-radius: 8px;
  background: var(--White);
}

.tour-detail-left-item-header {
  width: 100%;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.tour-detail-left-item-content {
  width: 100%;
}

.download-pdf {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.download-pdf .btn-download {
  width: 118px;
}

.summary-container {
  display: flex;
  align-items: stretch;
  gap: 30px;
  align-self: stretch;
}

.summary-container .line {
  width: 1px;
  background: linear-gradient(0deg, rgba(195, 195, 195, 0.00) 0%, #C3C3C3 50.52%, rgba(195, 195, 195, 0.00) 100%);
}

.summary-container .summary-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
}

.summary-container .summary-item .item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.summary-container .summary-item .item .title {
  font-family: var(--font-primary-medium);
}

.journey-list {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  align-self: stretch;
}

.journey-list .journey-item {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.journey-list .journey-item:not(:last-child) {
  padding-bottom: 16px;
  border-bottom: 1px solid #ECECEC;
}

.journey-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  gap: 16px;
  cursor: pointer;
}

.journey-item-header .title {
  flex: 1;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
}

.journey-item-header .icon {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}

.journey-item.active .journey-item-header .icon {
  transform: rotate(180deg);
}

.journey-item-content {
  max-height: 0;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  margin-top: 0;
}

.journey-item.active .journey-item-content {
  max-height: 1000px;
  margin-top: 16px;
}

.inclusion-exclusion-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  flex: 1 0 0;
}

.inclusion-exclusion-item .title {
  font-family: var(--font-primary-medium);
}

.inclusion-exclusion-item ul {
  padding-left: 20px;
}

.search-departure .form-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 230px;
}

.search-departure .form-item label {
  color: #000;
  margin: 0;
}

.search-departure .form-item .form-control {
  display: flex;
  width: 100%;
  padding: 12px 16px;
  align-items: center;
  gap: 8px;
  border-radius: 4px;
  background: var(--Foundation-Green-green-500);
  height: 48px;
}

.search-departure .form-item .form-control>img {
  filter: brightness(0) invert(1);
}

.search-departure .form-item .form-control select {
  color: #fff;
  border: none;
  background-color: transparent;
  outline: none;
  width: 100%;
  height: 24px;
  appearance: none;
  cursor: pointer;
  background-image: url('../img/icons/CaretDown-white.svg');
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: right 2px top 3px;
  margin-top: 2px;
}

.search-departure .form-item .form-control select option {
  color: var(--gray-9---body-text);
}

.departure-schedule-content {
  margin-top: 16px;
  width: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  border: 1px solid var(--gray-4---stroke);
  overflow: hidden;
}

.departure-schedule-header {
  display: flex;
  align-items: flex-start;
  align-self: stretch;
  background: var(--Foundation-Green-green-50);
}

.departure-schedule-header-item {
  display: flex;
  padding: 12px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-bottom: 2px solid;
  border-color: transparent;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  margin-bottom: 2px;
}

.departure-schedule-header-item.active,
.departure-schedule-header-item:hover {
  color: var(--Foundation-Green-green-500);
  border-color: var(--Foundation-Green-green-500);
}

.departure-schedule-box {
  width: 100%;
  display: none;
}

.departure-schedule-box.active {
  display: block;
}

.departure-schedule-table {
  width: 100%;
}

.departure-schedule-table thead tr th {
  padding: 8px 16px;
  gap: 10px;
  background: #F3F4F3;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  font-weight: unset;
  line-height: 24px;
  border-bottom: 1px solid #EDEDED;
  border-right: 1px solid #EDEDED;
}

.departure-schedule-table tbody tr td {
  padding: 12px 16px;
  gap: 10px;
  align-self: stretch;
  border-bottom: 1px solid #EDEDED;
  border-right: 1px solid #EDEDED;
}

.departure-schedule-table tbody tr:last-child td {
  border-bottom: none;
}

.departure-schedule-table tbody tr td:last-child,
.departure-schedule-table thead tr th:last-child {
  border-right: none;
}

.departure-schedule-price {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
}

.departure-schedule-price .first {
  display: flex;
  align-items: flex-end;
  gap: 4px;
}

.departure-schedule-price .first .title {
  color: var(--gray-6---subtle-text);
}

.departure-schedule-price .first .value {
  color: #FF7226;
  font-family: var(--font-primary-bold);
  font-size: 22px;
}

.departure-schedule-price .first .until {
  color: var(--gray-9---body-text);
}

.departure-schedule-price .btn-booking-now {
  width: 148px;
}

.btn-equipment {
  display: flex;
  height: 40px;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 16px auto 0 auto;
}

.review-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
}

.review-header {
  display: flex;
  padding: 16px 24px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 8px;
  background: #F3F4F3;
}

.review-header-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.review-header-left .first {
  display: flex;
  width: 254px;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.review-header-left .first .title {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 56px;
  font-style: normal;
  line-height: 64px;
  text-transform: uppercase;
}

.review-header-left .desc {
  font-family: var(--font-primary-medium);
}

.btn-write-review {
  width: max-content;
  cursor: pointer;
}

.review-list {
  width: 100%;
  padding-right: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  max-height: 500px;
  overflow-y: scroll;
}

.review-list::-webkit-scrollbar {
  width: 8px;
}

.review-list::-webkit-scrollbar-thumb {
  background: #C4C4C4;
  border-radius: 8px;
}

.review-list::-webkit-scrollbar-track {
  background: #F3F4F3;
  border-radius: 8px;
}

.review-list::-webkit-scrollbar-button {
  display: none;
}

.review-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
  width: 100%;
}

.review-item:not(:last-child) {
  padding-bottom: 16px;
  border-bottom: 1px solid #EDEDED;
}

.review-item .first {
  display: flex;
  align-items: center;
  gap: 8px;
}

.review-item .first .avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
}

.review-item .first .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.review-item .first .info .name {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
}

.review-item .first .info .rating-time {
  display: flex;
  align-items: center;
  gap: 4px;
}

.review-item .first .info .rating-time .rating {
  display: flex;
  align-items: center;
  gap: 2px;
}

.review-item .first .info .rating-time .time {
  font-family: var(--font-primary-medium);
  font-size: 12px;
  line-height: 20px;
  margin-top: 2px;
}

.modal-form-review .modal-dialog {
  width: min(95%, 720px);
  height: 100%;
  display: flex;
  align-items: center;
}

.modal-form-review .modal-content {
  width: 100%;
}

.modal-form-review .modal-content .modal-header {
  display: flex;
  padding: 8px 32px;
  align-items: center;
  gap: 16px;
  align-self: stretch;
  border: none;
  justify-content: space-between;
}

.modal-form-review .modal-content .modal-header::after,
.modal-form-review .modal-content .modal-header::before {
  display: none;
}

.modal-form-review .modal-content .modal-header .modal-title {
  color: #232323;
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.modal-form-review .modal-content .modal-header .btn-close {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
}

.modal-form-review .modal-body {
  padding: 24px 32px;
}

.rating-star-icon img {
  filter: brightness(0) invert(0);
  opacity: 0.4;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}

.rating-star-icon.active img {
  filter: brightness(1) invert(0);
  opacity: 1;
}

.form-rating-star {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #E4E7EB;
}

.form-rating-star label {
  color: var(--gray-9---body-text);
}

.rating-star {
  display: flex;
  align-items: flex-start;
  gap: 4px;
}

.rating-star select {
  display: none;
}

.form-review .row {
  margin: 0 -8px;
}

.form-review .row>* {
  padding: 0 8px;
}

.form-review .form-item {
  margin-bottom: 24px;
}

.form-review .form-item label {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
}

.form-review .form-item label .required {
  color: #DC1F26;
}

.form-review .form-item .form-control {
  display: flex;
  min-height: 44px;
  padding: 10px 16px;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--gray-4---stroke);
  background: #FFF;
  resize: none;
  outline: none;
  box-shadow: none;
}

.form-review .form-item .form-control::placeholder {
  color: var(--gray-6---subtle-text);
}

.form-review .form-item .form-control:focus,
.form-review .form-item .form-control:hover {
  border-color: var(--Foundation-Green-green-500);
}

.form-review .form-button {
  display: flex;
  align-items: center;
  justify-content: center;
}

.booking-container {
  padding: 32px 0 72px 0;
}

.booking-inner {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 30px;
  justify-content: center;
}

.booking-left {
  flex: 1;
  max-width: 790px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.booking-right {
  display: flex;
  width: 380px;
  flex-direction: column;
  align-items: flex-start;
  background: #FFF;
  box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.10);
  border-radius: 4px 4px 0 0;
  overflow: hidden;
}

body:has(.tours-detail-container) .footer-container .footer-form-container {
  background-color: var(--White);
}

.info-booking-img {
  width: 100%;
  height: 260px;
}

.info-booking-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.info-booking-content {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  align-self: stretch;
}

.info-booking-content .info-booking-item {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.info-booking-content .info-booking-item.first {
  gap: 8px;
}

.info-booking-content .info-booking-item.first .title {
  color: #292929;
  font-family: var(--font-primary-medium);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.info-booking-content .info-booking-item:not(:last-child) {
  padding-bottom: 20px;
  border-bottom: 1px solid #E4E7EB;
}

.info-booking-item.date {
  flex-direction: row;
  align-items: center;
}

.info-booking-item.date .date-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.info-booking-item.date .date-item .date-item-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.info-booking-item.date .date-item .date-item-content .title {
  color: var(--gray-6---subtle-text);
  font-size: 14px;
  line-height: 22px;
}

.info-booking-item.date .date-item .date-item-content .value {
  font-family: var(--font-primary-medium);
}

.info-booking-item.guest .guest-item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 16px;
}

.info-booking-item.guest .guest-item .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  flex: 1 0 0;
}

.info-booking-item.guest .guest-item .left .title {
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
}

.info-booking-item.guest .guest-item .right {
  color: #292929;
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.info-booking-item.price .item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 16px;
}

.info-booking-item.price .item .left {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.info-booking-item.price .item .left .title {
  color: #292929;
  font-family: var(--font-primary-medium);
}

.info-booking-item.price .item .left .sub-title {
  color: #292929;
}

.info-booking-item.price .item .right,
.promotional-code .title {
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.promotional-code {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.form-promotional-code {
  width: 100%;
  display: flex;
  height: 48px;
  padding: 10px 4px 10px 16px;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid var(--gray-4---stroke);
  background: #FFF;
}

.form-promotional-code .form-control {
  flex: 1;
  border: none;
  outline: none;
  box-shadow: none;
  padding: 0;
}

.form-promotional-code a {
  width: max-content;
  cursor: pointer;
}

.deposit-haft {
  display: flex;
  padding: 16px;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  background: #F7F7F7;
  width: 100%;
}

.deposit-haft label,
.regulations-instructions label {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  margin: 0;
}

.deposit-haft label input[type="checkbox"] {
  display: none;
}

.regulations-instructions {
  display: flex;
  padding: 24px 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  border-radius: 4px;
  background: #F7F7F7;
}

.regulations-instructions .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.regulations-instructions-content {
  height: 170px;
  overflow-y: scroll;
  padding-right: 8px;
}

.regulations-instructions-content::-webkit-scrollbar {
  width: 5px;
}

.regulations-instructions-content::-webkit-scrollbar-thumb {
  background-color: var(--Foundation-Green-green-500);
  border-radius: 10px;
}

.regulations-instructions-content::-webkit-scrollbar-track {
  background-color: #F7F7F7;
  width: 1px;
}

.booking-step-container {
  display: flex;
  align-items: flex-start;
}

.booking-step-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.booking-step-item .header {
  display: flex;
  width: 100%;
  padding-right: 24px;
  align-items: center;
  gap: 16px;
}

.booking-step-item .header .icon {
  width: 12px;
  height: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}


/* .booking-step-item .header .icon img:not(:first-child) {
  position: absolute;
  left: 0;
  top: 0;
} */

.booking-step-item .header .line {
  height: 3px;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--gray-4---stroke);
  transition: all 0.3s ease-in-out;
}

.booking-step-item:last-child .header .line {
  display: none;
}

.booking-step-item .content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.booking-step-item .content .title {
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
}

.booking-step-item .content .content {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

.booking-form-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.booking-form-container>.title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.booking-form-box {
  display: flex;
  width: 100%;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  background: #F3F4F3;
}

.booking-form-item {
  width: 100%;
}

.booking-form-item:not(:last-child) {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.booking-form-item .row {
  margin: 0 -8px;
}

.booking-form-item .row>* {
  padding: 0 8px;
}

.booking-form-item .form-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 16px;
}

.booking-form-item .form-item label {
  color: var(--gray-9---body-text, #262626);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  margin: 0;
}

.booking-form-item .form-item label .note {
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-regular);
}

.booking-form-item .form-item>.note {
  display: flex;
  justify-content: flex-start;
  gap: 8px;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-regular);
}

.booking-form-item .form-item .form-control {
  display: flex;
  min-height: 44px;
  padding: 10px 16px;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--gray-4---stroke);
  background: var(--White);
  outline: none;
  box-shadow: none;
  transition: all 0.3s ease-in-out;
  resize: none;
}

.booking-form-item .form-item .form-control::placeholder {
  color: var(--gray-6---subtle-text);
}

.booking-form-item .form-item .form-control:hover,
.booking-form-item .form-item .form-control:focus {
  border-color: var(--Foundation-Green-green-500);
}

.booking-form-item .title {
  margin-bottom: 24px;
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-bold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
}

.booking-form-item .form-item:has(.radio-inline) label:not(.radio-inline) {
  height: 48px;
}

.booking-form-item .form-item .radio-inline input[type="radio"] {
  display: none;
}

.booking-form-item .form-item .radio-inline {
  display: flex;
}

.booking-form-item .form-item .radio-inline::before {
  position: absolute;
  left: 0;
  top: 5px;
}

.booking-form-item .form-action {
  display: flex;
  align-items: center;
  justify-content: center;
}

.booking-form-item .form-action .btn-next-step {
  height: 48px;
}

.booking-form-item .form-item select.form-control {
  appearance: none;
  background-image: url(../img/icons/CaretDown-2.svg);
  background-repeat: no-repeat;
  background-size: 16px;
  background-position: right 12px center;
}

.booking-form-item.tour-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.booking-form-item.tour-info .tours-name {
  color: #292929;
  font-family: var(--font-primary-medium);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.booking-form-item.tour-info .items {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.booking-form-item.tour-info {
  padding-bottom: 24px;
}

.booking-form-item.tour-info .items .item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.booking-form-item.tour-info .items .item-title {
  font-family: var(--font-primary-medium);
}

.booking-form-item.tour-info .items .item-value {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.booking-form-item.personal-info .title {
  margin-bottom: 0;
}

.booking-form-item.personal-info .row>* {
  margin-bottom: 16px;
}

.booking-form-item.personal-info {
  border-bottom: 1px dashed #D5E7C4;
}

.booking-form-box .box-title {
  font-family: var(--font-primary-medium);
  font-size: 18px;
  line-height: 26px;
  margin-bottom: -8px;
}

.booking-form-item.personal-info .personal-info-item {
  display: flex;
  flex-direction: column;
}

.booking-form-item.personal-info .personal-info-item .personal-info-item-title {
  color: var(--gray-6---subtle-text);
}

.booking-form-item.personal-info .personal-info-item .personal-info-item-value {
  font-family: var(--font-primary-medium);
}

.booking-form-item.personal-info:last-child {
  border: none;
}

.payment-form {
  width: 100%;
}

.payment-form .filter-item {
  margin-bottom: 16px;
  display: flex;
  padding: 8px 16px;
  align-items: center;
  gap: 16px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--gray-4---stroke);
  background: #FFF;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  width: 100%;
}

.payment-form .filter-item:hover,
.payment-form .filter-item:has(input[type="radio"]:checked) {
  border-color: var(--Foundation-Green-green-500);
}

.payment-form .filter-item input[type="radio"] {
  display: none;
}

.payment-form .filter-item .title {
  font-family: var(--font-primary-medium);
  flex: 1;
}

.payment-form .filter-item span {
  width: 20px;
  height: 20px;
  border: 2px solid;
  border-color: var(--gray-4---stroke);
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
  position: relative;
}

.payment-form .filter-item span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  background: var(--Foundation-Green-green-500);
  border-radius: 50%;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

.payment-form .filter-item input[type="radio"]:checked~span::before {
  opacity: 1;
}

.payment-form .filter-item input[type="radio"]:checked~span,
.payment-form .filter-item:hover span {
  border-color: var(--Foundation-Green-green-500);
}

.payment-form .form-button {
  width: 100%;
  display: flex;
  justify-content: center;
}

.payment-form .form-button .btn-next-step {
  height: 48px;
}

.booking-form-item.tour-info .item.total .item-title {
  font-size: 18px;
  line-height: 26px;
}

.booking-form-item.tour-info .item.total .item-value {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.booking-form-box.success-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.booking-form-box.success-box>.title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.btn-back-home {
  height: 48px;
  margin: 0 auto
}

/* slide home */

.hero-slider {
  width: 100%;
  height: 100vh;
  position: relative;
}

.hero-slide {
  background-size: cover;
  background-position: center;
  position: relative;
}

.hero-slide::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .3);
}

.hero-content {
  position: absolute;
  left: 8%;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  z-index: 2;
}

.hero-content h2 {
  font-size: 28px;
  font-weight: 500;
}

.hero-content h1 {
  font-size: 56px;
  font-weight: 700;
}

/* ===== TIMELINE BÊN PHẢI ===== */
.hero-timeline {
  position: absolute;
  right: 40px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 20px;
  z-index: 5;
}

.hero-timeline::before {
  content: '';
  position: absolute;
  left: 50%;
  top: -40px;
  bottom: -40px;
  width: 1px;
  background: rgba(255, 255, 255, .5);
  transform: translateX(-50%);
}

.hero-timeline .dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  opacity: .5;
  cursor: pointer;
}

.hero-timeline .dot.active {
  opacity: 1;
  box-shadow: 0 0 0 6px rgba(255, 255, 255, .3);
}

.banner-item {
  position: relative;
}

.banner-home .banner-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
  bottom: unset;
  width: min(95%, 1320px);
}

.banner-home .banner-content .banner-title {
  width: min(100%, 757px);
  color: var(--White);
  font-family: var(--font-primary-black);
  font-size: 72px;
  font-style: normal;
  line-height: 72px;
  text-transform: capitalize;
}

.banner-home {
  position: relative;
  overflow: hidden;
}

.box-home-1 .logo {
  position: absolute;
  top: -65px;
  z-index: 10;
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--White);
  padding: 8px;
  border-radius: 50% 50% 0 0;
}

.box-home-1 .logo .curve-1::after {
  content: "";
  position: absolute;
  bottom: 41px;
  left: -24px;
  width: 30px;
  height: 30px;
  background: radial-gradient(circle at bottom right, transparent 60%, #ffffff 61%);
  transform: rotate(180deg);
}

.box-home-1 .logo .curve-2::after {
  content: "";
  position: absolute;
  bottom: 41px;
  right: -24px;
  width: 30px;
  height: 30px;
  background: radial-gradient(circle at bottom right, transparent 60%, #ffffff 61%);
  transform: rotate3d(0, 0, 1, 270deg);
}

.form-search-tour-home {
  width: min(95%, 1320px);
  display: flex;
  align-items: center;
  gap: 16px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: rgba(0, 0, 0, 0.50);
  backdrop-filter: blur(16px);
  z-index: 10;
  position: absolute;
  bottom: 100px;
  left: 50%;
  transform: translateX(-50%);
}

.form-search-tour-home .form-item {
  flex: 1;
  padding: 8px 16px;
  border-right: 1px solid rgba(255, 255, 255, 0.20);
}

.form-search-tour-home .form-item:nth-last-child(2) {
  border-right: none;
  padding: 8px 0 8px 16px;
}

.form-search-tour-home .form-item label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--White);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.form-search-tour-home .form-item .select2-container--default {
  width: 100% !important;
}

.form-search-tour-home .form-item .select2-container--default .select2-selection--single {
  background-color: transparent;
  height: 36px;
  padding: 6px 0;
  border: none;
}

.form-search-tour-home .form-item .form-control {
  background-color: transparent;
  border: none;
  box-shadow: none;
  outline: none;
  color: var(--White);
  background-image: url('/img/icons/CaretDown-2.svg');
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-position: right center;
  padding-right: 20px;
  padding: 6px 0;
}

.form-search-tour-home .form-button {
  margin-right: 16px;
}

.form-search-tour-home .form-button button {
  width: 165px;
  height: 46px;
}

.select2-selection__arrow {
  display: none;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--White);
  background-image: url('/img/icons/CaretDown-2.svg');
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-position: right center;
  padding: 0 20px 0 0;
}

.box-home-3 {
  padding: 56px 0;
  background-image: url('/img/bg-box-home-3.webp');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-color: #F3F4F3;
}

.box-home-3-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

.box-home-3-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(100%, 800px);
}

.box-home-3-header .desc {
  color: var(--gray-7);
  text-align: center;
}

.box-home-3-tags {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.box-home-3-tags .tag {
  display: flex;
  height: 40px;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 40px;
  border: 1px solid;
  border-color: var(--gray-4---stroke);
  background: #FFF;
  transition: all 0.3s ease-in-out;
  color: var(--gray-6---subtle-text);
  text-align: center;
  font-family: var(--font-primary-medium);
  min-width: 64px;
  cursor: pointer;
}

.box-home-3-tags .tag:hover,
.box-home-3-tags .tag.active {
  border-color: var(--Foundation-Green-green-500);
  background: var(--Foundation-Green-green-500);
  color: var(--White);
}

.box-home-3-content {
  width: 100%;
}

.box-home-3-content-carousel .owl-stage-outer {
  margin: -12px;
  padding: 12px;
}

.box-home-3-content-carousel .owl-next,
.box-home-3-content-carousel .owl-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -70px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--White);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(12px);
}

.box-home-3-content-carousel .owl-next {
  left: auto;
  right: -70px;
}

.box-home-3-content-carousel .tours-item .tours-item-img {
  height: 256px;
}

.box-home-4 {
  padding: 56px 0;
}

.box-home-4-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 56px;
}

.box-home-4-first {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.box-home-4-first-1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  flex: 1 0 0;
}

.box-home-4-first-1 .header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  gap: 16px;
}

.box-home-4-first-1 .header .box-home-4-header-title:first-child {
  width: 301px;
  height: 69px;
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-millanova);
  font-size: 40px;
  font-style: normal;
  line-height: normal;
}

.box-home-4-first-1 .header .box-home-4-header-title:last-child {
  color: var(--Title);
  font-family: var(--font-primary-bold);
  font-size: 44px;
  font-style: normal;
  line-height: 52px;
}

.box-home-4-first-2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  flex: 1 0 0;
}

.box-home-4-first-2 .btn-about-us {
  border-color: var(--Foundation-Green-green-500);
  width: 165px;
  height: 40px;
}

.box-home-4-first-3 {
  display: flex;
  flex-direction: column;
}

.box-home-4-first-3-img {
  margin: -210px 0 0 -147px;
}

.box-home-4-second {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  padding-top: 56px;
  background: var(--Foundation-Green-green-200);
}

.box-home-4-second .main-title {
  color: var(--Title);
}

.box-home-4-second-content-carousel .item {
  display: flex;
  padding: 0 16px;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.box-home-4-second-content-carousel .item .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.box-home-4-second-content-carousel .item .desc {
  text-align: center;
  font-size: 14px;
  line-height: 22px;
}

.box-home-5 {
  position: relative;
  width: 100%;
  height: 588px;
}

.box-home-5::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 17, 6, 0.30);
}

.box-home-5 .box-home-5-video {
  width: 100%;
  height: 100%;
}

.box-home-5 .box-home-5-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.box-5-content {
  position: absolute;
  top: 0;
  width: 606px;
  height: 100%;
  left: 164px;
  background: rgba(0, 0, 0, 0.10);
  backdrop-filter: blur(15.100000381469727px);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}

.box-5-content-text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 400px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.box-5-content-text .desc {
  width: 370px;
  color: var(--White);
  opacity: 0.7;
}

.box-5-content-text .btn-view-all {
  width: 165px;
  height: 40px;
  border-color: var(--Foundation-Green-green-500);
}

.box-5-content-text .main-title {
  color: var(--White);
}

.box-5-video,
.box-5-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.btn-play-video {
  cursor: pointer;
  position: absolute;
  top: 50%;
  left: 70%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

.box-home-6 {
  padding: 56px 0;
}

.box-home-6-inner {
  display: flex;
  flex-direction: column;
  gap: 56px;
}

.box-home-6-first {
  padding-bottom: 56px;
  border-bottom: 1px solid #C1DCA8;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
}

.box-home-6-first-content {
  width: 100%;
}

.box-home-6-first-last {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.box-home-6-first-last .title {
  color: var(--Title);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.box-home-6-first-last .tag {
  display: flex;
  padding: 8px 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  border-radius: 8px;
  background: #FFF;
  box-shadow: 0 6px 25px 0 rgba(0, 0, 0, 0.10);
}

.customer-say-item {
  width: 80%;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
}

.customer-say-item-img {
  flex: 1;
}

.customer-say-item-content {
  display: flex;
  width: 564px;
  height: 396px;
  padding: 112px 32px 40px 152px;
  align-items: flex-start;
  border-radius: 8px;
  background: #F3F4F3;
}

.customer-say-item-content .icon {
  min-width: 92px;
  margin-top: -80px;
  margin-left: -80px;
}

.customer-say-item-content .customer-say-item-text {
  margin-left: -16px;
}

.customer-say-item-text .editor-content {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 8px;
  overflow: hidden;
  height: 192px;
}

.customer-say-item-info {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-top: 16px;
}

.customer-say-item-info .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.customer-say-item-info .first .name {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.customer-say-item-info .first .location {
  color: var(--gray-7);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.customer-say-item-info .rating {
  display: flex;
  align-items: flex-start;
}

.customer-say-item-info .rating img {
  width: 20px !important;
}

.customer-say-item-img {
  min-width: 486px;
  height: 384px;
  margin-right: -80px;
  margin-top: -40px;
  position: relative;
}

.customer-say-item-img .img-content {
  position: absolute;
  top: 19px;
  left: 20px;
  border-radius: 8px;
  overflow: hidden;
  width: calc(100% - 33px);
  height: calc(100% - 37px);
}

.customer-say-item-img .img-content img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.box-home-6-first-content-carousel {
  margin: 36px 0 0 0;
}

.box-home-6-first-content-carousel .owl-stage-outer {
  padding: 36px 0 0 0;
}

.box-home-6-first-content-carousel .owl-next,
.box-home-6-first-content-carousel .owl-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  left: 0;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 6px 25px 0 rgba(0, 0, 0, 0.10);
}

.box-home-6-first-content-carousel .owl-next {
  left: auto;
  right: 0;
}

.box-home-6-second {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.box-home-6-second .box-home-6-second-header {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
}

.box-home-6-second .box-home-6-second-header .main-title {
  color: var(--Title);
}

.box-home-6-second .box-home-6-second-header .btn-link-view-all {
  display: flex;
  height: 40px;
  padding: 8px 0;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid var(--Foundation-Green-green-500);
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-medium);
}

.box-home-6-second-content {
  width: 100%;
}

.box-home-1 {
  width: 100%;
  height: 939px;
  background-image: url(/img/bg-box-home-1.bg-box-home-3.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-color: #F3F4F3;
  padding: 112px 0 0 0;
  position: relative;
}

.box-home-1 .container,
.box-home-1-content {
  height: 100%;
}

.box-home-1-inner {
  display: inline-flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 60px;
  width: 100%;
  height: 100%;
  position: relative;
}

.box-home-1-content {
  flex: 1;
  height: 827px;
  max-width: 585px;
}

.box-home-1-img-first {
  margin-left: -88px;
}

.box-home-1-img-first img{
  width: 468px;
}

.box-home-1-img-second {
  position: absolute;
  top: -61px;
  left: 35%;
}

.vertical-swiper {
  width: 100%;
  height: 105%;
}

.swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  /* font-size: 48px; */
  color: #fff;
}

.box-home-1-content-item {
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
}

.box-home-1-content-item-img {
  width: 100%;
  height: 100%;
  position: relative;
  display: block;
  overflow: hidden;
}

.box-home-1-content-item-img>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .3s ease-in-out;
}

.box-home-1-content-item:hover .box-home-1-content-item-img>img {
  transform: scale(1.05);
}

.box-home-1-content-item-img::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 36, 38, 0.00) 40.36%, rgba(0, 36, 38, 0.40) 50.01%, rgba(0, 36, 38, 0.90) 90.73%);
}

.tours-item-location>img {
  width: 20px !important;
}

.box-home-1-content-item .tours-item-location {
  z-index: 10;
  top: 16px;
  left: 24px;
}

.box-home-1-content-item .tours-item-location .title {
  font-size: 16px;
  line-height: 24px;
}

.box-home-1-content-item-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  padding: 16px 24px;
  align-items: flex-start;
  gap: 16px;
  z-index: 10;
}

.box-home-1-content-item-content-right {
  width: 114px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.box-home-1-content-item-content-right .title {
  color: var(--White);
  font-family: var(--font-primary-regular);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.box-home-1-content-item-content-right .price {
  color: #FF7226;
  font-family: var(--font-primary-black);
  font-size: 24px;
  font-style: normal;
  line-height: 26px;
}

.box-home-1-price-mobile {
  position: absolute;
  top: 16px;
  right: 24px;
  z-index: 10;
  display: none;
  color: #FF7226;
  font-family: var(--font-primary-black);
  font-size: 24px;
  font-style: normal;
  line-height: 26px;
}

.box-home-1-content-item-content-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
}

.box-home-1-content-item-content-left .first {
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.20);
}

.box-home-1-content-item-content-left .first .rating {
  display: flex;
  align-items: center;
  gap: 4px;
}

.box-home-1-content-item-content-left .first .rating .star,
.box-home-1-content-item-content-left .first .rating .review {
  display: flex;
  align-items: center;
  gap: 2px;
  color: var(--White);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.box-home-1-content-item-content-left .first .title {
  color: var(--White);
  font-family: var(--font-primary-bold);
  font-size: 22px;
  font-style: normal;
  line-height: 28px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 56px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.box-home-1-content-item-content-left .second {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.box-home-1-content-item-content-left .second .item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.box-home-1-content-item-content-left .second .item .title {
  color: var(--White);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.box-home-1-content-item-content-left .second .item .value {
  color: var(--White);
  font-family: var(--font-primary-regular);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  display: flex;
  align-items: center;
}

.box-home-1-content-item-content-left .second .item .icon {
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-pagination {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.box-home-2 {
  position: relative;
}

.box-home-2 .img-map {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
  z-index: 10;
}

.box-home-2-item {
  position: relative;
  height: 776px;
}

.box-home-2-item>.box-home-2-item-img {
  width: 100%;
  height: 100%;
  position: relative;
}

.box-home-2-item>.box-home-2-item-img:after {
  content: '';
  left: 0;
  position: absolute;
  top: 0;
  background: linear-gradient(90deg, rgba(0, 36, 38, 0.00) 72.89%, rgba(0, 36, 38, 0.95) 100%);
  width: 100%;
  height: 100%;
}

.box-home-2-item>.box-home-2-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.box-home-2-item-content {
  width: 740px;
  height: 100%;
  background: rgba(0, 0, 0, 0.60);
  backdrop-filter: blur(19px);
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.box-home-2-item-content>div {
  margin-left: 178px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.box-home-2-item-content>div .first {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: center;
}

.box-home-2-item-content>div .first .tag {
  color: var(--White);
  font-family: var(--font-primary-bold);
  font-size: 20px;
  font-style: italic;
  line-height: 30px;
  margin-bottom: -12px;
  margin-left: 80px;
}

.box-home-2-item-content>div .first .title {
  color: var(--White);
  font-family: var(--font-primary-black);
  font-size: 122px;
  font-style: normal;
  line-height: 130px;
}

.box-home-2-item-content>div .desc {
  width: min(100%, 460px);
  opacity: 0.7;
}

.box-home-2-item-content .btn-view-tour {
  width: 165px;
  border-color: var(--Foundation-Green-green-500);
  margin-top: 16px;
}

.box-home-2-swiper .swiper-pagination {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #7E7E7E;
  position: relative;
  width: max-content;
  margin-bottom: -16px;
}

.box-home-2-swiper .swiper-pagination .swiper-pagination-current,
.box-home-2-swiper .swiper-pagination .swiper-pagination-total {
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.box-home-2-swiper .swiper-pagination .swiper-pagination-current {
  color: var(--White);
}

.swiper-actions {
  display: inline-flex;
  height: 48px;
  justify-content: center;
  align-items: center;
  gap: 16px;
  position: absolute;
  bottom: 112px;
  left: 178px;
  z-index: 100;
}

.swiper-actions .swiper-button-prev,
.swiper-actions .swiper-button-next {
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  left: 0;
  display: flex;
  width: 40px;
  height: 40px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.10);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(12px);
  margin: 0 !important;
}

.swiper-actions .swiper-button-prev::after,
.swiper-actions .swiper-button-next::after {
  display: none;
}

/* test slide */

.md_slider {
  position: relative;
  overflow: hidden;
}

.md_slider__item {
  position: relative;
  display: block !important;
}

.md_slider__item__img {
  position: relative;
}

.md_slider__item__img:after {
  content: '';
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  background: linear-gradient(358deg, rgba(0, 0, 0, 0.30) 1.7%, rgba(0, 0, 0, 0.00) 40.38%);
}

.md_slider__item__img img {
  display: block;
  width: 100%;
}

.page-home .md_slider__item__img img {
  min-height: 340px;
  height: 100vh;
}

.banner,
.slider-relative {
  position: relative;
}

.md_slider__item__title {
  text-transform: uppercase;
  color: #fff;
  font-weight: 800;
  font-size: 52px;
  line-height: 1.38462;
  max-width: 35.41667vw;
  margin-bottom: 10px;
}

.md_slider__item__ct {
  position: absolute;
  left: 16%;
  right: 16%;
  bottom: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 1;
  padding-top: 55px;
}

.md_slider__circle {
  pointer-events: none;
}

.md_slider__circle__line {
  position: absolute;
  top: 50%;
  left: 136%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border-style: solid;
  border-color: rgba(255, 255, 255, .3);
  border-width: 1px;
  border-top-width: 0;
  z-index: 6;
}

.md_slider__circle__line:before {
  content: '';
  display: block;
  padding-top: 100%;
}

.md_slider__circle__line.-sm {
  width: 26.66667vw;
}

.md_slider__circle__line.-sm .md_slider__circle__line__rotate {
  bottom: -1px;
  left: -1px;
  position: absolute;
  right: -1px;
  top: -1px;
  -webkit-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  opacity: .2;
}

.md_slider__circle__line.-sm .md_slider__circle__line__rotate:before {
  content: '';
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  border-radius: 50%;
  border-style: solid;
  border-color: #fff;
  border-width: 1px;
  border-top-color: transparent;
  border-right-width: 0;
  border-bottom-width: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.md_slider__circle__line.-sm .md_slider__circle__line__rotate:after {
  content: '';
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, .9);
  top: -4px;
  margin-left: -3px;
  left: 50%;
}

.md_slider__circle__line.-sm .md_slider__circle__line__rotate.active {
  -webkit-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  transform: rotate(360deg);
  -webkit-transition: all 6.15s ease-in-out;
  -o-transition: all 6.15s ease-in-out;
  transition: all 6.15s ease-in-out;
  opacity: 1;
}

.md_slider__circle__line.-md {
  width: 50.26042vw;
}

.md_slider__circle__line.-lg {
  width: 87.76042vw;
  border-color: rgba(255, 255, 255, .6);
}

.md_slider__thumb {
  position: absolute !important;
  top: 50% !important;
  -webkit-transform: translate(0, -50%) !important;
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  pointer-events: all;
  width: 8.64583vw;
  margin-left: -4.32292vw;
}

.md_slider__thumb__img {
  margin: auto;
  width: 5.20833vw;
  height: 5.20833vw;
  border-radius: 50%;
  border: solid 1px transparent;
  position: relative;
  background-color: rgba(255, 255, 255, .8);
  -webkit-transition: all .8s ease-in-out;
  -o-transition: all .8s ease-in-out;
  transition: all .8s ease-in-out;
}

.md_slider__thumb__img img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  -webkit-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}

.md_slider__thumb .slick-slide {
  cursor: pointer;
  -webkit-transform: translateY(100%);
  -ms-transform: translateY(100%);
  transform: translateY(100%);
}

.md_slider__thumb .slick-slide:not(.slick-current) .md_slider__thumb__img {
  -webkit-transform: scale(.1);
  -ms-transform: scale(.1);
  transform: scale(.1);
}

.md_slider__thumb .slick-slide:not(.slick-current) .md_slider__thumb__img img {
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}

.md_slider__thumb .slick-slide:hover .md_slider__thumb__img {
  background-color: var(--Foundation-Green-green-500);
}

.md_slider__thumb .slick-slide.slick-slide .md_slider__thumb__img {
  left: 2.55208vw;
  border: none;
}

.md_slider__thumb .slick-slide.slick-slide .md_slider__thumb__img>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.md_slider__thumb .slick-slide.slick-slide+.slick-active .md_slider__thumb__img {
  left: 1.30208vw;
}

.md_slider__thumb .slick-slide.slick-slide+.slick-active+.slick-active .md_slider__thumb__img {
  left: .33854vw;
}

.md_slider__thumb .slick-slide.slick-slide+.slick-active+.slick-current .md_slider__thumb__img {
  left: 0;
}

.md_slider__thumb .slick-slide.slick-slide+.slick-active+.slick-current+.slick-active+.slick-active .md_slider__thumb__img {
  left: 1.25vw;
}

.md_slider__thumb .slick-current .md_slider__thumb__img {
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.md_slider__thumb .slick-current .md_slider__thumb__img img {
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.md_slider__thumb .slick-current .md_slider__thumb__img:before {
  top: -8px;
  left: -8px;
  right: -8px;
  bottom: -8px;
  position: absolute;
  content: '';
  border-radius: inherit;
  border: dashed 1px var(--Foundation-Green-green-500);
}

.md_slider__action {
  position: absolute;
  bottom: 50%;
  margin-bottom: -26px;
  right: 4.27083vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@-webkit-keyframes rotate {
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotate {
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes sliderScroll {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
    top: 60%
  }
}

@keyframes sliderScroll {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
    top: 60%;
  }
}

/* Animation mây */

.md_slider__item__text {
  position: absolute;
  top: 20%;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 99;
  width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.md_slider__item__text .text-1 {
  font-family: var(--font-millanova);
  font-size: 48px;
  font-weight: 400;
  line-height: 88px;
  text-align: center;
  color: #FF9500;
  height: 34px;
}

.md_slider__item__text .text-2 {
  font-family: var(--font-raleway-extraBold);
  font-size: 96px;
  font-weight: 900;
  line-height: 96px;
  letter-spacing: 7.68px;
  text-align: center;
  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-transform: uppercase;
  width: 700px;
}

.md_slider__item__text .link {
  padding: 15px 24px;
  font-family: var(--font-raleway-bold);
  font-size: 18px;
  font-weight: 700;
  line-height: 26px;
  letter-spacing: 0.12em;
  text-align: center;
  background: #FFFFFF;
  color: #0D3422;
  border-radius: 65px;
  display: flex;
  gap: 16px;
  width: fit-content;
  margin-top: 32px;
  align-items: center;
}

.md_slider__item {
  height: 918px;
}

.md_slider__item__img {
  height: 100%;
}

.md_slider__item__img>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vertical-swiper .swiper-pagination{
  opacity: 0;
}


@media (min-width: 1440px) {
  .container {
    padding: 0;
  }
}

@media (max-width: 1500px) {
  .box-5-content {
    left: 34px;
  }
  .md_slider__item {
    height: 690px;
  }

  .box-home-2-item-content {
    width: 562px;
  }

  .box-home-2-item-content>div {
    margin-left: 120px;
  }

  .box-home-2-item-content>div .first .title {
    font-size: 92px;
    line-height: 102px;
  }

  .swiper-actions {
    left: 120px;
  }

  /* .box-home-1 .logo{
    top: -190px;
  } */
}