@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
  --green: #163315;
  --green-d: #112310;
  --cream: #fcfaf5;
  --sand: #f7f3ea;
  --olive: #6d6b34;
  --ink: #333;
	 --font-head: "Cinzel", serif;
  --font-body: "Poppins", sans-serif;
}
body {
  font-family: Poppins, sans-serif;
  color: var(--ink);
  background: var(--cream);
  font-size: 16px;
  line-height: 1.8
}

body::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #6d6b34;
}

body::-webkit-scrollbar
{
	width: 6px;
	background-color: #6d6b34;
}

body::-webkit-scrollbar-thumb
{
	background-color: #163315;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-head);
  font-weight: 500;
  color: var(--green);
  line-height: 1.3;
	letter-spacing: -0.5px;
}
.h1, h1{
	font-size: 45px;
	
}
.h2, h2 {
	font-size: 35px;
}
.h3, h3 {
	font-size: 25px;
}
.h4, h4 {
	font-size: 22px;
}
.h5, h5 {
	font-size: 20px;
}
.h6, h6 {
	font-size: 18px;
}
.row{
	margin-top: 0
}
a {
  color: inherit;
  text-decoration: none;
}
img {
  display: block;
  max-width: 100%;
}

* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}

.row>*{
	margin-top: 0
}
.wrap {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 24px;
}
/* ---------- Header ---------- */
.header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  background-color: #f7f3ea;
}
.header-inner {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  position: relative;
}
.nav-right {
  display: flex;
  align-items: center;
  gap: 18px;
}
.burger {
  width: 38px;
  height: 38px;
  border: 0;
  cursor: pointer;
  background: var(--gold);
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
}
.burger span {
  display: block;
  width: 16px;
  height: 1.5px;
  background: #fff;
  transition: transform 0.3s ease, opacity 0.25s ease;
}
.burger.is-open span:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}
.burger.is-open span:nth-child(2) {
  opacity: 0;
}
.burger.is-open span:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}
.nav-links {
  display: flex;
  gap: 25px;
}
.nav-links a {
  font-size: 13px;
  letter-spacing: 0.05em;
  color: var(--gold-dark);
  text-transform: uppercase;
}
.nav-links a:hover {
  color: var(--ink);
}
.logo {
  text-align: left;
  line-height: 1.1;
  display: block;
}
.logo .mark {
  font-size: 26px;
  color: var(--gold);
  letter-spacing: 0.04em;
}
.logo .name {
  font-family: var(--font-head);
  font-size: 22px;
  letter-spacing: 0.22em;
  color: var(--gold-dark);
}
.logo .sub {
  font-size: 8px;
  letter-spacing: 0.4em;
  color: var(--muted);
}
.mobile-menu {
  display: none;
  flex-direction: column;
  background: var(--cream);
  border-top: 1px solid #ddd;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}
.mobile-menu a {
  padding: 15px 28px;
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold-dark);
  border-bottom: 1px solid #ddd;
}
.header.menu-open .mobile-menu {
  max-height: 420px;
}
.btn {
  display: inline-block;
  padding: 10px 25px;
  font-size: 13px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  border: 1px solid var(--gold);
  transition: 0.25s ease;
  cursor: pointer;
}
.btn-solid {
  background: var(--gold);
  color: #fff;
}
.btn-solid:hover {
  background: var(--gold-dark);
  border-color: var(--gold-dark);
}
.btn-ghost {
  color: var(--gold-dark);
  background: transparent;
  border-radius: 999px;
  padding: 14px 30px;
}
.btn-ghost:hover {
  background: var(--gold);
  color: #fff;
}
.btn-ghost-light {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
  border-radius: 999px;
  padding: 14px 30px;
}
.btn-ghost-light:hover {
  background: #fff;
  color: var(--ink);
}
/* ---------- Hero slider ---------- */
.hero {
  margin-top: 0;
  position: relative;
  height: 100vh;
  overflow: hidden;
  background: #17140f;
  transition: margin-top 0.3s ease;
}
.slides {
  position: absolute;
  inset: 0;
}
.slide {
  position: absolute;
  inset: 0;
  background: center/cover no-repeat;
  opacity: 0;
  transform: scale(1.08);
  transition: opacity 1.2s ease, transform 7s linear;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.12) 45%, rgba(0, 0, 0, 0.5));
}
.slide.is-active {
  opacity: 1;
  transform: scale(1);
  z-index: 1;
}
.slide-caption {
  position: relative;
  z-index: 2;
  text-align: center;
  color: #fff;
  padding: 0 24px;
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.9s ease 0.35s, transform 0.9s ease 0.35s;
}
.slide.is-active .slide-caption {
  opacity: 1;
  transform: none;
}
.slide-caption .kicker {
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  margin: 0 0 18px;
}
.slide-caption h1 {
  font-family: var(--font-head);
  font-weight: 400;
  font-size: clamp(30px, 4.6vw, 60px);
  line-height: 1.18;
  margin: 0 0 28px;
  text-shadow: 0 2px 26px rgba(0, 0, 0, 0.35);
}
.slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.6);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transition: 0.25s ease;
}
.slider-arrow:hover {
  background: var(--gold);
  border-color: var(--gold);
}
.slider-arrow.prev {
  left: 28px;
}
.slider-arrow.next {
  right: 28px;
}
.slider-dots {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 34px;
  display: flex;
  justify-content: center;
  gap: 12px;
}
.slider-dots .dot {
  width: 34px;
  height: 2px;
  padding: 0;
  border: 0;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.45);
  transition: 0.3s ease;
}
.slider-dots .dot.is-active {
  background: var(--gold);
  transform: scaleY(2);
}
.scroll-hint {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 66px;
  width: 1px;
  height: 46px;
  background: rgba(255, 255, 255, 0.55);
  animation: hint 2.2s ease-in-out infinite;
}
@keyframes hint {
  0%, 100% {
    transform: translateY(0);
    opacity: 0.25;
  }
  50% {
    transform: translateY(10px);
    opacity: 1;
  }
}
/* ---------- Scroll reveal & motion ---------- */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.reveal.in-view {
  opacity: 1;
  transform: none;
}
.header.is-compact {
  box-shadow: 0 6px 26px rgba(0, 0, 0, 0.07);
  background-color: #f7f3ea;
}
.header-inner {
  transition: height 0.3s ease;
}
.card, .offer, .quote {
  transition: transform 0.45s ease, box-shadow 0.45s ease;
}
.card:hover, .offer:hover, .quote:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(47, 43, 38, 0.1);
}
.card img, .split img, .exp img {
  transition: transform 1.1s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.card, .split, .exp {
  overflow: hidden;
}
.card:hover img, .exp:hover img, .split:hover img {
  transform: scale(1.06);
}
.btn {
  transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.btn:hover {
  transform: translateY(-2px);
}
.know {
  transition: letter-spacing 0.3s ease;
}
.know:hover {
  letter-spacing: 0.24em;
}
.to-top {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
}

/* ---------- Booking bar ---------- */
.booking {
  padding: 30px 0 34px;
}
.booking .rate {
  text-align: center;
  font-size: 13px;
  color: var(--gold-dark);
  margin: 0 0 10px;
}
.booking-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr) 200px;
  border: 1px solid #ddd;
  background: #fff;
}
.field {
  padding: 14px 18px;
  border-right: 1px solid #ddd;
}
.field label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
}
.field .value {
  font-size: 14px;
  color: var(--ink);
}
.booking-bar .btn-solid {
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
	background-color: var(--green)
}
.booking-bar .btn-solid:hover{
	color: #fff
}
.manage {
  text-align: center;
  font-size: 12px;
  color: var(--gold-dark);
  margin-top: 10px;
}
/* ---------- Sections ---------- */
section {
  padding: 92px 0;
}
.eyebrow {
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 14px;
}
h2 {
  font-family: var(--font-head);
  margin: 0 0 22px;
}
p {
  margin: 0 0 18px;
}
.lead a {
  color: var(--gold-dark);
  border-bottom: 1px solid rgba(175, 139, 76, 0.4);
}
.about {
  background: var(--cream-2);
}
.split {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 64px;
  align-items: center;
}
.pl-40 {
  padding-left: 40px;
}
.split img {
  width: 100%;
  height: 460px;
  object-fit: cover;
}
/* Cards / carousel rows */
.cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 40px;
}
.card {
  background: #fff;
  border: 1px solid #ddd;
}
.card img {
  width: 100%;
  height: 250px;
  object-fit: cover;
}
.card-body {
  padding: 24px;
}
.card-body h3 {
  font-family: var(--font-head);
  font-weight: 400;
  font-size: 21px;
  margin: 0 0 10px;
  color: var(--ink);
}
.card-body p {
  font-size: 14px;
  margin-bottom: 16px;
}
.know {
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold-dark);
  border-bottom: 1px solid var(--gold);
  padding-bottom: 3px;
}
.carousel-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin-top: 42px;
  font-size: 14px;
  color: var(--muted);
}
.carousel-nav .bar {
  width: 160px;
  height: 1px;
  background: #ddd;
  position: relative;
}
.carousel-nav .bar::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 45px;
  height: 1px;
  background: var(--gold);
}
.carousel-nav .bar i {
  position: absolute;
  left: 0;
  top: 0;
  height: 1px;
  width: 45px;
  background: var(--gold);
  transition: transform 0.5s ease;
  z-index: 1;
}
.rooms .carousel-nav .bar::after {
  display: none;
}
.rooms .carousel-nav .room-prev, .rooms .carousel-nav .room-next {
  cursor: pointer;
  transition: color 0.3s ease;
}
.rooms .carousel-nav .room-prev:hover, .rooms .carousel-nav .room-next:hover {
  color: var(--gold-dark);
}
/* ---------------------------------------------------------
   KNOW MORE
--------------------------------------------------------- */
.room-body .know {
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold-dark);
  border-bottom: 1px solid var(--gold);
  padding-bottom: 4px;
}
/* ---------------------------------------------------------
   NAVIGATION
--------------------------------------------------------- */
.room-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin-top: 42px;
  font-size: 12px;
}
/* Previous / Next */
.room-navigation button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-family: inherit;
  font-size: 12px;
  cursor: pointer;
  transition: color 0.3s ease, letter-spacing 0.3s ease;
}
.room-navigation button:hover {
  color: var(--gold-dark);
  letter-spacing: 0.04em;
}
/* ---------------------------------------------------------
   PROGRESS BAR
--------------------------------------------------------- */
.room-navigation .bar {
  position: relative;
  display: block;
  width: 120px;
  height: 1px;
  background: #ddd;
  overflow: hidden;
}
/* Moving indicator */
.room-navigation .bar i {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 35px;
  height: 1px;
  background: var(--gold);
  transform: translateX(0);
  transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Offers strip */
.offers {
  text-align: center;
}
.offers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 40px;
}
.offer {
  border: 1px solid #ddd;
  background: #fff;
  margin-bottom: 0;
    height: 100%;
}
.offer .fac-info {
  padding: 30px 20px;
}

#events {
  background: var(--cream-2);
}
/* Experiences (olive band) */
.experiences {
  background: #163315;
  color: #fff;
}
.experiences h2, .experiences .eyebrow {
  color: #fff;
}
.experiences p {
  color: rgba(255, 255, 255, 0.85);
}
.exp-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
  margin-top: 52px;
}
.exp figure {
  margin: 0;
}
.exp img {
  width: 100%;
  height: 300px;
  object-fit: cover;
}
.exp figcaption {
  font-family: var(--font-head);
  font-size: 17px;
  text-align: center;
  margin-top: 14px;
}
/* Amenities */
.amenities {
  background: #5f5d2c;
  color: #fff;
  text-align: center;
}
.amenities h2, .amenities .eyebrow {
  color: #fff;
}
.amen-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  border: 1px solid rgba(255, 255, 255, 0.25);
  margin-top: 44px;
}
.amen-grid div {
  padding: 34px 12px;
  font-size: 13px;
  border-right: 1px solid rgba(255, 255, 255, 0.25);
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
.amen-grid div .ico {
  display: block;
  font-size: 26px;
  margin-bottom: 12px;
}
/* Testimonials */
.testimonials {
  text-align: center;
  background: var(--cream-2);
}
.quotes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 42px;
  text-align: left;
}
.quote {
  background: #fff;
  border: 1px solid #ddd;
  padding: 30px 28px;
  position: relative;
}
.quote h3 {
  font-family: var(--font-head);
  font-weight: 400;
  font-size: 19px;
  margin: 0 0 14px;
}
.quote p {
  font-size: 14px;
}
.stars {
  color: var(--gold);
  letter-spacing: 3px;
}
/* Newsletter */
.newsletter {
  background: var(--gold);
  color: #fff;
  text-align: center;
  padding: 64px 0;
}
.newsletter p {
  color: rgba(255, 255, 255, 0.9);
  max-width: 620px;
  margin: 0 auto 22px;
}
.news-form {
  display: flex;
  justify-content: center;
  gap: 0;
}
.news-form input {
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: transparent;
  padding: 14px 18px;
  width: 320px;
  color: #fff;
  font-family: inherit;
}
.news-form input::placeholder {
  color: rgba(255, 255, 255, 0.8);
}
.news-form button {
  border: 1px solid #fff;
  background: #fff;
  color: var(--gold-dark);
  padding: 14px 28px;
  font-size: 13px;
  letter-spacing: 0.16em;
  cursor: pointer;
}
/* Footer */
footer {
  background: #163315;
  padding: 72px 0 0px;
}
.foot-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.2fr 1.5fr 1fr;
  gap: 35px;
}
.foot-grid h4 {
  font-size: 25px;
  letter-spacing: normal;
  text-transform: capitalize;
  color: #fff;
  margin: 0 0 20px;
  font-weight: 500;
}
.foot-grid p, .foot-grid a {
  color: #fff;
}
.footer_add {
  margin-top: 15px;
}
.foot-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
}
.foot-menu a:hover {
  color: var(--gold-dark);
}
.footer-menu ul {
  padding-left: 1rem;
  list-style: disc;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  display: grid;
}
.footer-social ul {
  list-style-type: none;
  display: flex;
  justify-content: flex-start;
  padding-left: 0;
  gap: 15px;
}
.footer-social ul li a i {
  background-color: #fff;
  color: #163315;
  width: 35px;
  height: 35px;
  line-height: 35px;
  border-radius: 5px;
}
.footer-contact i {
  margin-right: 8px;
  font-size: 15px;
  background-color: #ffffff;
  color: #163315;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border: 1px solid #fff;
  border-radius: 5px;
}
.mt-30 {
  margin-top: 30px;
}
::marker {
  color: #fff;
}
.copyright-sec {
  margin-top: 46px;
  padding-top: 10px;
  border-top: 1px solid rgb(247 247 247 / 40%);
  font-size: 13px;
  color: #f2f2f2;
  padding-bottom: 10px;
}
.mid-logo {
  float: right;
}
/* Floating buttons */
.floaties {
  position: fixed;
  right: 0;
  top: 55%;
  z-index: 40;
  display: grid;
	gap: 10px;
}
.floaties a {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #6d6b34;
  color: #fff;
  font-size: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.to-top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 40;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--green);
  background: var(--cream);
  color: var(--green);
  display: flex;
  align-items: center;
  justify-content: center;
}
/* ---------- Responsive ---------- */


/* ---------- Generic carousels ---------- */
.carousel {
  margin-top: 30px;
  position: relative;
}
.carousel .carousel-viewport {
  overflow: hidden;
}
.carousel .carousel-track {
  display: flex;
  align-items: stretch;
  gap: 26px;
  margin-top: 0;
  transition: transform 0.75s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
.carousel .carousel-nav .bar::after {
  display: none;
}
.carousel .c-prev, .carousel .c-next {
  cursor: pointer;
  transition: color 0.3s ease, letter-spacing 0.3s ease;
}
.carousel .c-prev:hover, .carousel .c-next:hover {
  color: var(--gold-dark);
  letter-spacing: 0.06em;
}
.carousel[data-per] .carousel-track > * {
  flex: 0 0 calc((100% - 52px) / 3);
  max-width: calc((100% - 52px) / 3);
}
.carousel-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 30px;
}
.carousel-dots span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  cursor: pointer;
  background: rgba(22, 51, 21, 0.35);
  transition: all 0.35s ease;
}
.carousel-dots span.is-active {
  background: #163315;
  transform: scale(1.5);
}
/* Experiences centred peek carousel */
.exp-carousel .carousel-track {
  gap: 24px;
  align-items: center;
}
.exp-carousel .exp {
  flex: 0 0 34%;
  max-width: 34%;
  margin: 0;
  position: relative;
  transition: transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.6s ease;
  opacity: 0.55;
  cursor: pointer;
  overflow: hidden;
}
.exp-carousel .exp.is-active {
  opacity: 1;
  transform: scale(1.06);
  z-index: 2;
}
.exp-carousel .exp img {
  height: 340px;
}
.exp-carousel .exp figcaption {
  transition: opacity 0.4s ease;
}
.exp-carousel .exp.is-active figcaption {
  opacity: 0;
}
.exp-over {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 43px;
  padding: 26px 26px 24px;
  text-align: left;
  background: linear-gradient(to top, rgba(28, 28, 18, 0.88), rgba(28, 28, 18, 0));
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s ease 0.1s, transform 0.5s ease 0.1s;
}
.exp-carousel .exp.is-active .exp-over {
  opacity: 1;
  transform: none;
}
.exp-over h3 {
  font-family: var(--font-head);
  font-weight: 400;
  font-size: 20px;
  color: #fff;
  margin: 0 0 8px;
}
.exp-over p {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}
/* Parallax on split imagery */
.split img {
  transform: translate3d(0, var(--py, 0px), 0);
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.split:hover img {
  transform: translate3d(0, var(--py, 0px), 0) scale(1.06);
}
.logo {
  max-width: 250px;
}



/* =========================================
   ACCOMMODATION SLIDER
========================================= */
.rooms {
  overflow: hidden;
}
.room-carousel {
  width: 100%;
  overflow: hidden;
  position: relative;
  margin-top: 0;
}
/* Important: shift entire slider left like reference website */
.room-slider {
  width: 100%;
  margin-left: 0px;
}
.room-slider .slick-list {
  overflow: visible;
}
.room-slider .slick-track {
  display: flex;
  align-items: center;
}
/* Each slide */
.room-slider .slick-slide {
  width: 910px !important;
  transition: all .5s ease;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
}
/* Slide itself */
.room-slide {
  position: relative;
  width: 910px !important;
  min-width: 910px !important;
  max-width: 910px !important;
  margin: 0 10px;
  outline: none;
}
/* Active slide */
.room-slide.slick-current {
  opacity: 1;
  z-index: 10;
  transform: translateY(60px);
  -webkit-transform: translateY(60px);
  -moz-transform: translateY(60px);
  -ms-transform: translateY(60px);
  -o-transform: translateY(60px);
}
.room-slide.slick-current .room-shot {
  height: 630px;
}
/* =========================================
   ROOM IMAGE
========================================= */
.room-shot {
  width: 910px;
  height: 559px;
  overflow: hidden;
}
.room-shot img {
  display: block;
  width: 810px !important;
  height: 559px !important;
  max-width: none !important;
  object-fit: cover;
}
/* =========================================
   ROOM INFORMATION CARD
========================================= */
.room-body {
  position: absolute;
  top: 50%;
  right: -140px;
  box-sizing: border-box;
  padding: 30px 32px;
  background: #fff;
  border: 1px solid #d8c39b;
  z-index: 20;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(20px, -50%, 0);
  transition: opacity 0.4s ease, transform 0.5s ease;
	max-width: 400px;
}
/* Active card */
.room-slide.slick-current .room-body {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, -50%, 0);
}
/* Heading */
.room-body h3 {
  margin: 0 0 22px;
}

/* Know More */
.room-body .know {
  display: inline-block;
  font-size: 12px;
  color: #a87b22;
  text-decoration: none;
  border-bottom: 1px solid #a87b22;
  padding-bottom: 4px;
}
/* =========================================
   NAVIGATION
========================================= */
.room-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  margin-top: 42px;
}
.room-navigation button {
  border: 0;
  padding: 0;
  background: transparent;
  font-size: 13px;
  color: #444;
  cursor: pointer;
}
.room-navigation .bar {
  position: relative;
  width: 287px;
  height: 1px;
  background: #cfcfcf;
}
.room-navigation .bar i {
  position: absolute;
  left: 0;
  top: 0;
  width: 42px;
  height: 2px;
  background: #b58522;
  transition: transform 0.6s cubic-bezier(.22, .61, .36, 1);
}
.footer-logo {
  max-width: 190px;
    margin: auto;
}
.footer-social {
    display: flex;
    flex-direction: column;
    align-items: center;
}
/*new css start here*/ 
.topbar {
  background: var(--green-d);
  color: #e9e4d6;
  padding: 6px 0
}
.topbar a {
  color: #e9e4d6;
  text-decoration: none
}

.site-nav {
    background: transparent;
    box-shadow: none;
    padding: .6rem 0;
    transition: all .5s ease;
    position: fixed;
    z-index: 999;
     width: 100%;
    top: 0;
}
.site-nav.fixedNav {
  
	  background: rgba(252, 250, 245, .97);
  box-shadow: 0 2px 20px rgba(0, 0, 0, .06);
}
.site-nav .nav-link, .navbar-nav .nav-link.active {
 font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #fff;
    font-weight: 500;
    padding: .5rem .6rem !important;
    position: relative;
    white-space: nowrap;
	transition: none !important
}
/*.site-nav .nav-link.active, */
.site-nav .nav-link:hover {
  color: var(--olive)
}
.navbar-brand img.d-logo, .site-nav.fixedNav .navbar-brand img.w-logo{display: none}

.site-nav.fixedNav .navbar-brand img.d-logo{
	display: block
}
.site-nav.fixedNav .nav-link, .site-nav.fixedNav.navbar-nav .nav-link.active{
	color: var(--green)
}
/*
.site-nav .nav-link.active:after {
  content: "";
  position: absolute;
  left: .7rem;
  right: .7rem;
  bottom: 2px;
  height: 2px;
  background: var(--olive)
}
*/
.btn {
  white-space: nowrap;
  border-radius: 3px;
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .75rem 1.6rem;
  font-weight: 500
}
.btn-brand {
  background: var(--green);
  color: #fff;
  border: 1px solid var(--green)
}
.btn-brand:hover {
  background: var(--olive);
  border-color: var(--olive);
  color: #fff
}
.btn-outline-brand {
  border: 1px solid var(--green);
  color: var(--green)
}
.btn-outline-brand:hover {
  background: var(--green);
  color: #fff
}
.btn-light-k {
  background: var(--cream);
  color: var(--green)
}
.btn-light-k:hover {
  background: var(--olive);
  color: #fff
}
.btn-ghost-light {
  border: 1px solid rgba(255, 255, 255, .7);
  color: #fff
}
.btn-ghost-light:hover {
  background: #fff;
  color: var(--green)
}
.eyebrow {
  display: inline-block;
  font-size: 13px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--olive);
  font-weight: 600;
  margin-bottom: .6rem
}
.eyebrow.light {
  color: #e6dfb8
}
.rule {
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 2rem;
}
.rule:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 60px;
  height: 2px;
  background: var(--olive)
}
.rule.center:after {
  left: 50%;
  transform: translateX(-50%)
}
.sec-head {
  margin-bottom: 1.5rem
}
.sticky-lg-top{
	z-index: 9
}
.sec {
  padding: 90px 0
}
.bg-sand {
  background: var(--sand)
}
.bg-green {
  background: var(--green)
}
.text-light-k h2, .text-light-k .sec-head p {
  color: #fff
}
.text-light-k .eyebrow {
  color: #e6dfb8
}

.zoom {
  overflow: hidden;
  position: relative
}
.zoom img {
  transition: transform 1s ease;
  width: 100%;
  object-fit: cover
}
.zoom:hover img {
  transform: scale(1.07)
}
.framed {
  border-radius: 4px;
  box-shadow: 24px 24px 0 var(--sand);
	aspect-ratio: 4 / 3.5;
}
.framed img {
  height: 100%
}
.k-card {
  background: #fff;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(22, 51, 21, .07);
  transition: transform .4s, box-shadow .4s
}
.k-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(22, 51, 21, .15)
}
.k-card img {
  height: 250px
}

.k-card p {
  color: #666;
  font-size: .92rem
}
.room .tag {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--green);
  color: #fff;
  font-size: .72rem;
  padding: 4px 10px;
  border-radius: 2px
}
.meta {
  color: var(--olive) !important;
  font-size: .82rem !important
}
.link-u {
  color: var(--olive);
  text-decoration: none;
  font-weight: 500;
  font-size: .85rem
}
.link-u:hover {
  color: var(--green)
}
.home-hero {
  position: relative;
  height: 100vh;
  min-height: 600px;
	padding: 0
}
.home-hero .carousel, .home-hero .carousel-inner, .home-hero .carousel-item {
  height: 100%
}
.home-hero .carousel{
	margin-top: 0;
    opacity: 1;
    transform: none;
}
.home-hero .carousel-item {
  background-size: cover;
  background-position: center
}
.home-hero .carousel-item:after, .page-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(17, 35, 16, .50), rgba(17, 35, 16, .15))
}
.hero-copy {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  z-index: 2;
  pointer-events: none
}
.hero-copy .btn {
  pointer-events: auto
}
.hero-copy h1 {
  color: #fff;
    margin-bottom: 15px;
    font-weight: 500;
    animation: rise 1.2s ease both;
}
.hero-copy p {
  color: #eee;
  font-size: 1.1rem;
  max-width: 520px;
  margin-bottom: 2rem
}
@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(30px)
  }
  to {
    opacity: 1;
    transform: none
  }
}
.carousel-control-prev, .carousel-control-next {
  z-index: 3;
  width: 6%
}

.form-control, .form-select {
  border-radius: 3px;
  padding: .8rem 1rem;
  border-color: #ddd6c4;
  background: var(--cream)
}
.form-control:focus, .form-select:focus {
  border-color: var(--olive);
  box-shadow: none
}
.exp-tile {
  border-radius: 4px;
  height: 380px
}
.exp-tile img {
  height: 100%
}
.exp-tile .cap {
  position: absolute;
  inset: auto 0 0 0;
  padding: 24px;
  background: linear-gradient(transparent, rgba(17, 35, 16, .9));
  color: #fff
}
.exp-tile h5 {
  color: #fff
}
.exp-tile p {
  font-size: .85rem;
  margin: 0;
  opacity: .9
}
.quote {
  background: #fff;
  border-left: 3px solid var(--olive);
  padding: 34px;
  border-radius: 4px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .05)
}
.quote i {
  font-size: 2.6rem;
  color: var(--olive);
  line-height: 1
}
.quote p {
  font-style: italic;
  color: #555
}
.quote strong {
  display: block;
  color: var(--green)
}
.quote small {
  color: #888
}
.page-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 150px 0;
  color: #fff;
  text-align: center;
	min-height: 550px;
	display: flex;
    align-items: center;
}
.page-hero .container {
  position: relative
}
.page-hero h1 {
  color: #fff;
  font-size: 45px;
}
.page-hero p {
  opacity: .9
}
.crumbs {
  font-size: .8rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .85
}
.crumbs a {
  color: #e6dfb8;
  text-decoration: none
}
.cta-band {
  background: linear-gradient(rgba(17, 35, 16, .85), rgba(17, 35, 16, .85)), url("../images/hero3.webp") center/cover fixed;
  padding: 110px 0;
  color: #eee
}
.cta-band h2 {
  color: #fff;
}
.cta-band p {
  margin-bottom: 2rem
}
.stat b {
  display: block;
  font-family: var(--font-head);
  font-size: 3rem;
  color: #e6dfb8;
  font-weight: 800
}
.stat span {
  color: #ddd;
  text-transform: uppercase;
  font-size: .78rem;
  letter-spacing: .15em
}
.amen {
  background: #fff;
  padding: 26px 10px;
  border-radius: 4px
}
.amen i {
  font-size: 1.8rem;
  color: var(--olive);
  display: block;
  margin-bottom: 6px
}
.amen span {
  font-size: .85rem
}
.masonry {
  columns: 3 260px;
  column-gap: 16px
}
.g-item {
  display: block;
  margin-bottom: 16px;
  border-radius: 4px;
  break-inside: avoid
}
/*
.g-item:nth-child(3n) img {
  height: 420px
}
*/
.g-item img {
  height: 280px
}
.info {
  display: flex;
  gap: 16px;
  margin-bottom: 22px
}
.info i {
 width: 40px;
    height: 40px;
    flex: none;
    border-radius: 50%;
    background: var(--green);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 16px;
}
.info p {
  margin: 0;
  color: #555
}
.info a {
  text-decoration: none
}
.k-form {
  background: #fff;
  padding: 40px;
  border-radius: 4px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .07)
}
.map {
  width: 100%;
  height: 420px;
  border: 0;
  display: block
}
.site-footer {
  background: var(--green-d);
  color: #cfc9b8;
  padding: 80px 0 0;
  font-size: .9rem
}
.site-footer h6 {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .15em;
  font-size: .8rem;
  margin-bottom: 1.2rem
}
.site-footer a {
  color: #cfc9b8;
  text-decoration: none
}
.site-footer a:hover {
  color: #e6dfb8
}
.site-footer li {
  margin-bottom: .4rem
}
.social a {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 50%;
  margin-right: 8px
}
.social a:hover {
  background: var(--olive);
  border-color: var(--olive);
  color: #fff
}
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .1);
  margin-top: 50px;
  padding: 22px 0;
  font-size: .8rem
}

.f-call {
  background: var(--green)
}
.f-wa {
  background: #25d366
}
.f-top {
  background: var(--olive);
  opacity: 0;
  pointer-events: none;
  transition: .3s
}
.f-top.show {
  opacity: 1;
  pointer-events: auto
}
a#toTop {
    bottom: 10px;
    right: 15px;
    position: fixed;
}

.hero-copy p.small-lead {
  font-size: .98rem;
  opacity: .8;
  margin-bottom: 2rem
}
.hero-copy p {
  margin-bottom: .8rem
}
.booking-bar .price {
  font-size: 1.35rem
}
.usp {
  background: #fff;
  padding: 34px 30px;
  border-radius: 4px;
  box-shadow: 0 10px 30px rgba(22, 51, 21, .06);
  transition: transform .4s, box-shadow .4s
}
.usp:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(22, 51, 21, .14)
}
.usp i {
  font-size: 1.9rem;
  color: var(--olive)
}
.usp h4 {
  margin: 14px 0 8px
}
.usp p {
  margin: 0
}
.usp .num {
  font-weight: 600;
  color: rgba(109, 107, 52, .35)
}
.usp.top-line {
  border-top: 3px solid var(--olive)
}
.parallax {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative;
  padding: 130px 0;
  color: #eee
}
.parallax:before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(17, 35, 16, .72)
}
.parallax .container {
  position: relative;
  max-width: 760px
}
.parallax h2 {
  color: #fff;
  margin-bottom: 1rem
}
.parallax p {
  margin-bottom: 2rem
}
.attr {
  background: #fff;
  border-left: 3px solid var(--olive);
  padding: 22px;
  border-radius: 4px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, .05);
  height: 100%
}

.attr i {
  color: var(--olive)
}
.attr p {
  margin: 0;
}
.thumb {
  height: 230px;
  width: 100%;
  object-fit: cover;
  border-radius: 4px
}
.pull {
  border-left: 3px solid var(--olive);
  padding: .4rem 0 .4rem 1.2rem;
  margin: 1.5rem 0;
  font-family: var(--font-head);
  font-size: 18px;
  color: var(--green);
  font-weight: 600
}
.intro {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}
.checks {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px 20px;
  font-size: .92rem
}
.checks.three {
  grid-template-columns: repeat(3, 1fr)
}
.checks i {
  color: var(--olive);
  margin-right: 8px
}

.pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px
}
.pills span {
  background: var(--sand);
  color: var(--green);
  padding: 6px 14px;
  border-radius: 3px;
  font-size: .82rem
}
.bg-sand .pills span {
  background: #fff
}
.filters button {
  border: 0;
  background: var(--sand);
  color: var(--green);
  padding: 8px 18px;
  margin: 4px;
  border-radius: 3px;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 600
}
.filters button.active, .filters button:hover {
  background: var(--green);
  color: #fff
}
.g-item {
  position: relative
}
.g-item span {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 14px;
  color: #fff;
  font-size: .72rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  background: linear-gradient(transparent, rgba(17, 35, 16, .85));
  text-transform: uppercase
}
.two-col {
  columns: 2
}
.map-sm {
  width: 100%;
  height: 200px;
  border: 0;
  border-radius: 4px
}
.k-form .form-label {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--olive);
  font-weight: 600
}
.k-acc .accordion-item {
  border: 0;
  margin-bottom: 12px;
  border-radius: 4px !important;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(0, 0, 0, .05)
}
.k-acc .accordion-button {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--green);
  padding: 1.3rem 1.5rem
}
.k-acc .accordion-button:not(.collapsed) {
  background: var(--sand);
  color: var(--green);
  box-shadow: none
}
.k-acc .accordion-button:focus {
  box-shadow: none
}
.navbar-brand {
  flex-shrink: 0;
  max-width: 270px;
}
.navbar-brand img {
  height: auto;
  width: auto;
  display: block
}
.site-footer a[href^="mailto"] {
  word-break: break-all
}
.site-nav .container-fluid {
    max-width: 1420px;
}

/*
.site-nav .nav-link.active:after {
  left: .42rem;
  right: .42rem
}
*/
.site-nav .btn-brand {
  padding: .65rem 1.1rem;
  font-size: .75rem
}

.mt-1-5{
	margin-top: 2rem;
}
.row.g-4.mt-1-5 {
    gap: 20px 0;
}
.row.g-3 {
    gap: 20px 0;
}
.gap25{
	gap: 25px 0
}
.info-social ul {
    display: flex;
    list-style-type: none;
    justify-content: flex-start;
    padding-left: 0;
    gap: 15px;
}
.info-social ul li a {
    width: 40px;
    height: 40px;
    background-color: #163315;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    color: #fff;
    border-radius: 50%;
}


#roomwrap {
  padding: 30px 0;
}

#roomwrap #slider, #roomwrap #thumbnail_slider {
  width: 100%;
  margin: 0 auto 10px;
	padding-left: 0;
}

#roomwrap .slide-item img {
  width: 100%;
}

#roomwrap .thumbnail-item img {
  width: 98%;
  margin: 0 auto;
}
.fac_sec .offer{
	height: 100%;
}
.mobile-fixed-btn{
	display: none
}
.pb-40 {
    padding-bottom: 40px;
}
.footer-contact p {
    padding-left: 40px;
    font-size: 15px;
	position: relative
}
.footer-contact i {
    position: absolute;
    left: 0;
}
.footer-menu ul li{
	font-size: 15px;
}
.blog_img {
    margin-bottom: 30px;
}
ul.blog-list {
    list-style-type: none;
    padding-left: 0;
}
ul.blog-list li{
	position: relative
}
ul.blog-list li::before{
	 display: inline-block;
  content: "\f192";
  font-family: "Font Awesome 7 Free";  
  font-weight: 600;   
  margin-right: 8px;
	font-size: 13px;
	color: #163315;
}
.recent_blog {
    margin-bottom: 0;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .16), 0 1px 2px rgba(0, 0, 0, .23);
    padding: 25px 15px;
}
.gdlr-core-recent-post-widget {
    align-items: flex-start;
    display: flex;
}
.recent-post-widget-block {
    float: left;
    max-width: 100px;
    margin-right: 15px;
    overflow: hidden;
	width: 160px;
}
span.recent-core-blog-info {
    font-size: 14px;
    font-weight: 600;
    color: #163315;
}
.recent_blog-post-widget-wrap{
	margin-top: 15px;
}
.recent-post-widget-block img {
    height: 90px;
    object-fit: cover;
    width: 100%;
}
.blog_detail p a {
    color: #163315;
}
.mt-25{
	margin-top: 25px;
}
h4.mt-15 {
    margin-top: 15px;
}







