/* Shared design layer (body.site): tokens, type, buttons, header, footer, popup, inner pages.
   Palette: night #1f1611, sandstone #ead9b8, parchment #f7efdf, ochre #b4601a, madder #7a2b1d, ink #2a2019 */

body.site {
  --night: #1f1611;
  --night-2: #2c211a;
  --sand: #ead9b8;
  --parch: #f7efdf;
  --ochre: #b4601a;
  --ochre-dk: #8f4a12;
  --madder: #7a2b1d;
  --ink: #2a2019;
  --ink-soft: #5b4b3e;
  --line: rgba(42, 32, 25, .16);
  --display: "Rozha One", Georgia, serif;
  --text: "Mukta", "Segoe UI", system-ui, sans-serif;
  --arch: 999px 999px 10px 10px / 340px 340px 10px 10px;

  font-family: var(--text);
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink);
  background: var(--parch);
}

body.site h1,
body.site h2,
body.site h3 {
  font-family: var(--display);
  font-weight: 400;
  letter-spacing: 0;
  color: inherit;
}

body.site p { font-family: var(--text); text-align: left; }

body.site a:focus-visible,
body.site button:focus-visible,
body.site input:focus-visible,
body.site select:focus-visible {
  outline: 3px solid var(--ochre);
  outline-offset: 3px;
}

/* ---------- Buttons ---------- */
body.site .appoinment-btn-one,
body.site .default-btn-one {
  display: inline-block;
  background: var(--ochre);
  color: #fff;
  font: 600 16px/1 var(--text);
  letter-spacing: .01em;
  text-transform: none;
  padding: 15px 28px;
  border: 0;
  border-radius: 999px;
  transition: background-color .2s, transform .2s;
}
body.site .appoinment-btn-one:hover,
body.site .default-btn-one:hover {
  background: var(--ochre-dk);
  color: #fff;
}

/* ---------- Header (desktop: one row, logo | nav | actions) ---------- */
body.site .navbar-area {
  background: linear-gradient(to bottom, rgba(20, 12, 8, .72), rgba(20, 12, 8, 0));
  transition: background-color .3s, box-shadow .3s;
}
body.site .navbar-area:hover { background: var(--parch); }
body.site .navbar-area:hover .others-options .dropdown-toggle { color: var(--ink); }

@media (min-width: 992px) {
  body.site .navbar-area {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 24px;
    padding: 6px 32px;
  }
  body.site .top-header { display: contents; }
  body.site .top-header .call-back { display: none; }
  body.site .top-header .logo { grid-column: 1; grid-row: 1; width: 74px; }
  body.site .top-header .logo img { width: 74px; height: auto; display: block; }
  body.site .overtop-nav {
    grid-column: 2;
    grid-row: 1;
    border: 0;
    padding: 0;
    max-width: none;
    margin: 0;
  }
  body.site .overtop-nav .container { max-width: none; padding: 0; }
  body.site .top-header .others-options { grid-column: 3; grid-row: 1; display: flex; align-items: center; gap: 18px; }
  body.site .overtop-nav .navbar { padding: 0; }
  body.site .overtop-nav .navbar .navbar-nav { justify-content: center; }
  body.site .overtop-nav .navbar .navbar-nav .nav-item { margin: 0; padding: 0; }
}

body.site .overtop-nav .navbar .navbar-nav .nav-item a {
  color: #fff;
  font: 600 15px/1 var(--text);
  text-transform: none;
  letter-spacing: .01em;
  margin: 0;
  padding: 22px 14px;
  white-space: nowrap;
}
body.site .overtop-nav .navbar .navbar-nav .nav-item a i { margin-left: 4px; font-size: 11px; }
body.site .overtop-nav .navbar .navbar-nav .nav-item a:hover,
body.site .overtop-nav .navbar .navbar-nav .nav-item a.active {
  color: #f1b36b;
}
body.site .navbar-area:hover .overtop-nav .navbar .navbar-nav .nav-item a,
body.site .is-sticky .overtop-nav .navbar .navbar-nav .nav-item a { color: var(--ink); }
body.site .navbar-area:hover .overtop-nav .navbar .navbar-nav .nav-item a:hover,
body.site .navbar-area:hover .overtop-nav .navbar .navbar-nav .nav-item a.active,
body.site .is-sticky .overtop-nav .navbar .navbar-nav .nav-item a:hover,
body.site .is-sticky .overtop-nav .navbar .navbar-nav .nav-item a.active { color: var(--ochre); }

body.site .is-sticky {
  background-image: none !important;
  background-color: var(--parch) !important;
  box-shadow: 0 1px 0 var(--line);
}
body.site .is-sticky .top-header .logo,
body.site .is-sticky .top-header .logo img { width: 52px; }
body.site .is-sticky .overtop-nav .navbar .navbar-nav .nav-item a { padding-top: 16px; padding-bottom: 16px; }

body.site .overtop-nav .navbar .navbar-nav .nav-item .dropdown-menu {
  background: var(--parch);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 18px 40px rgba(31, 22, 17, .18);
  padding: 8px;
  min-width: 300px;
}
body.site .overtop-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {
  color: var(--ink);
  padding: 11px 14px;
  border-radius: 6px;
  font-weight: 500;
}
body.site .overtop-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover {
  background: var(--sand);
  color: var(--madder);
}

body.site .others-options .dropdown-toggle {
  background: transparent;
  border: 0;
  color: #fff;
  font: 500 15px var(--text);
  padding: 6px 4px;
}
body.site .navbar-area:hover .others-options .dropdown-toggle,
body.site .is-sticky .others-options .dropdown-toggle { color: var(--ink); }
body.site .others-options .dropdown { margin: 0 !important; }
body.site .others-options .navbar-nav { margin: 0; }
body.site .others-options .appoinment-btn-one { padding: 12px 24px; font-size: 15px; }

/* mobile bar */
body.site .overtop-mobile-nav { background: var(--parch); }
body.site .overtop-mobile-nav .logo img { width: 64px; }

/* ---------- Footer ---------- */
body.site .footer-section { background: var(--night); color: var(--parch); }
body.site .footer-section::before,
body.site .footer-section::after { display: none; }
body.site .footer-content h2 { font: 400 1.3rem/1.2 var(--display); color: var(--parch); text-transform: none; }
body.site .footer-list li a,
body.site .footer-info li,
body.site .footer-info li a { color: rgba(247, 239, 223, .78); font-size: 16px; }
body.site .footer-list li a:hover,
body.site .footer-info li a:hover { color: #f1b36b; }
body.site .footer-info li i { color: #f1b36b; }
body.site .footer-bottom-section { border-top: 1px solid rgba(247, 239, 223, .16); }
body.site .footer-bottom-section a,
body.site .footer-bottom-section p,
body.site .footer-bottom-section span { color: rgba(247, 239, 223, .78); }

/* ---------- Enquiry popup ---------- */
body.site #modalOverlay { background: rgba(18, 11, 7, .66); }
body.site .modalPopup {
  background: var(--parch);
  border-radius: 14px;
  padding: 30px 28px 26px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}
body.site .modalContent h2 { font: 400 1.7rem/1.2 var(--display); color: var(--night); margin: 0 0 16px; }
body.site .query-form input,
body.site .query-form textarea {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 14px;
  font: 400 16px var(--text);
}
body.site .query-form input:focus,
body.site .query-form textarea:focus { border-color: var(--ochre); }
body.site .query-form button {
  background: var(--ochre);
  border-radius: 999px;
  padding: 14px 25px;
  font: 600 16px var(--text);
}
body.site .query-form button:hover { background: var(--ochre-dk); }
body.site .buttonStyle {
  background: var(--night);
  border-radius: 0 14px 0 14px;
  width: 42px;
  height: 42px;
  padding: 0;
}

@media (max-width: 991px) {
  body.site { font-size: 16.5px; }
  body.site .navbar-area { background: var(--parch); }
}

@media (prefers-reduced-motion: reduce) {
  body.site * { transition: none !important; animation: none !important; }
}

@media (max-width: 767px) {
  body.site .mf-social-side-list { bottom: 16px; right: 8px; padding: 0; }
  body.site .mf-social-side-list ul li a { margin: 4px 0; }
  body.site .mf-social-side-list ul li a i img { width: 44px; }
}

/* =====================================================================
   Inner pages
   ===================================================================== */

/* Header sits over the banner on every page, so keep it light-on-dark until it turns solid. */

/* ---------- Page banner ---------- */
body.site .page-banner {
  padding: 190px 0 84px;
  background-image:
    linear-gradient(to top, rgba(18, 11, 7, .88) 0%, rgba(18, 11, 7, .5) 55%, rgba(18, 11, 7, .35) 100%),
    url(../img/hero/hero-aerial-resort.jpg);
  background-position: center 40%;
}
body.site .page-banner::before { display: none; }
body.site .page-banner .page-banner-content { text-align: left; }
body.site .page-banner .page-banner-content h2 {
  font: 400 clamp(2.2rem, 4.6vw, 4rem)/1.08 var(--display);
  color: #fff;
  margin: 0 0 14px;
  text-transform: none;
  text-wrap: balance;
  max-width: 20ch;
}
body.site .page-banner .page-banner-content p {
  font: 500 16px/1.4 var(--text);
  color: rgba(255, 255, 255, .8);
  margin: 0;
}
body.site .page-banner .page-banner-content p a { color: #f1c58d; }
body.site .page-banner .page-banner-content p a:hover { color: #fff; }

/* ---------- Generic content typography ---------- */
body.site .about-section,
body.site .contact-info-section,
body.site .contact-section,
body.site .gallery-page-section,
body.site .single-room-section,
body.site .package-page-section,
body.site .reception-section,
body.site .convention-section { background: var(--parch); }

body.site .about-section { padding: 88px 0; }
body.site .about-content span,
body.site .about-content > span { display: none; }
body.site .about-content h1,
body.site .about-content h2 {
  font: 400 clamp(1.9rem, 3vw, 2.7rem)/1.15 var(--display);
  color: var(--night);
  margin: 0 0 22px;
}
body.site .about-content h2::after,
body.site .about-content h1::after { display: none; }
body.site .about-content h3,
body.site .single-room-content h3 {
  font: 400 1.55rem/1.25 var(--display);
  color: var(--madder);
  margin: 34px 0 10px;
}
body.site .about-content p,
body.site .single-room-content p {
  font: 400 17px/1.75 var(--text);
  color: var(--ink-soft);
  text-align: left;
  margin: 0 0 1.1em;
}
body.site .about-content p strong,
body.site .single-room-content p strong { color: var(--ink); font-weight: 600; }
body.site .about-image img,
body.site .about-image { border-radius: 14px; overflow: hidden; }
body.site .about-image img { width: 100%; object-fit: cover; }
body.site .about-btn-one,
body.site .about-btn a {
  display: inline-block;
  background: var(--ochre);
  color: #fff;
  border-radius: 999px;
  padding: 14px 26px;
  font: 600 16px/1 var(--text);
}
body.site .about-btn-one:hover,
body.site .about-btn a:hover { background: var(--ochre-dk); color: #fff; }

/* ---------- Contact ---------- */
body.site .contact-info-section { padding: 80px 0 30px; }
body.site .contact-box {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: none;
  padding: 30px 24px;
  height: 100%;
  text-align: center;
}
body.site .contact-box .icon { color: var(--ochre); font-size: 34px; }
body.site .contact-box,
body.site .contact-box p,
body.site .contact-box a { text-align: center; }
body.site .contact-box h3,
body.site .contact-box h4 { font: 400 1.35rem/1.2 var(--display); color: var(--night); }
body.site .contact-box p,
body.site .contact-box a { font: 500 16px/1.6 var(--text); color: var(--ink-soft); }
body.site .contact-area { background: var(--parch); padding: 40px 0 90px; }
body.site .map-area iframe,
body.site .map-area { border-radius: 14px; overflow: hidden; }
body.site .contactForm .form-control,
body.site .reservation-form .form-control,
body.site .single-room-sidebar .form-control {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: 400 16px var(--text);
  color: var(--ink);
  box-shadow: none;
}
body.site .contactForm .form-control:focus,
body.site .reservation-form .form-control:focus { border-color: var(--ochre); outline: 0; }
body.site .send-btn-one,
body.site .send-btn button,
body.site .contactForm button[type=submit] {
  background: var(--ochre);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 15px 34px;
  font: 600 16px/1 var(--text);
  text-transform: none;
}
body.site .send-btn-one:hover { background: var(--ochre-dk); }

/* ---------- Tariff ---------- */
body.site .tab-room { margin: 0; }
body.site .tab-room table,
body.site .about-section table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  font-family: var(--text);
}
body.site .about-section table th {
  background: var(--night);
  color: var(--parch);
  font: 600 16px/1.3 var(--text);
  padding: 16px 20px;
  text-align: left;
  border: 0;
  text-transform: none;
}
body.site .about-section table td {
  padding: 15px 20px;
  font: 500 16px/1.4 var(--text);
  color: var(--ink);
  text-align: left;
  border: 0;
  border-top: 1px solid var(--line);
}
body.site .about-section table tr:nth-child(even) td { background: rgba(234, 217, 184, .35); }

/* ---------- Gallery ---------- */
body.site .gallery-page-section { padding: 80px 0 90px; }
body.site .filter-menu { text-align: left; margin-bottom: 34px; }
body.site .filter-menu .filter {
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 20px;
  font: 600 15px/1 var(--text);
  margin: 0 8px 8px 0;
  cursor: pointer;
}
body.site .filter-menu .filter.active,
body.site .filter-menu .filter:hover { background: var(--night); color: var(--parch); border-color: var(--night); }
body.site .single-work { border-radius: 12px; overflow: hidden; margin-bottom: 24px; }
body.site .work-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s; }
body.site .single-work:hover .work-image img { transform: scale(1.04); }

/* ---------- Attractions ---------- */
body.site .reception-section,
body.site .convention-section { padding: 56px 0; }
body.site .reception-content span,
body.site .convention-content span,
body.site .reception-shape-image,
body.site .convention-shape-image { display: none; }
body.site .reception-content h3,
body.site .convention-content h3 {
  font: 600 15px/1.3 var(--text);
  color: var(--ochre);
  text-transform: none;
  margin: 0 0 8px;
}
body.site .reception-content h2,
body.site .convention-content h2 {
  font: 400 clamp(1.8rem, 2.8vw, 2.5rem)/1.15 var(--display);
  color: var(--night);
  margin: 0 0 16px;
}
body.site .reception-content p,
body.site .convention-content p { font: 400 17px/1.75 var(--text); color: var(--ink-soft); text-align: left; }
body.site .reception-image img,
body.site .convention-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 999px 999px 12px 12px / 260px 260px 12px 12px;
}
body.site .convention-section { background: var(--sand); }

/* ---------- Room pages ---------- */
body.site .single-room-section { padding: 70px 0 90px; }
body.site .single-room-section .image-slider { border-radius: 14px; overflow: hidden; }
body.site .single-room-section .article-img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
body.site .single-room-content { padding-top: 34px; }
body.site .single-room-content h2 {
  font: 400 clamp(1.8rem, 3vw, 2.5rem)/1.15 var(--display);
  color: var(--night);
  margin: 0 0 12px;
}
body.site .star-list li i { color: var(--ochre); }
body.site .single-leave-reply {
  background: var(--night);
  color: var(--parch);
  border-radius: 14px;
  padding: 28px 24px;
}
body.site .single-room-sidebar { background: transparent; }
body.site .single-room-sidebar:empty,
body.site .single-room-sidebar .single-room-map:empty { display: none; }
body.site .single-leave-reply h2,
body.site .single-leave-reply h3 { font: 400 1.6rem/1.2 var(--display); color: var(--parch); text-align: left; }
body.site .single-leave-reply label { color: rgba(247, 239, 223, .85); font: 500 15px var(--text); }
body.site .single-leave-reply .send-btn-one { width: 100%; }
body.site .image-slider .owl-nav button.owl-prev,
body.site .image-slider .owl-nav button.owl-next {
  background: rgba(20, 12, 8, .35);
  border: 1px solid rgba(255, 255, 255, .6);
  color: #fff;
  border-radius: 50%;
}
body.site .image-slider .owl-nav button.owl-prev:hover,
body.site .image-slider .owl-nav button.owl-next:hover { background: var(--ochre); border-color: var(--ochre); }

/* ---------- Packages ---------- */
body.site .package-page-section { background: var(--parch); }
body.site .package-main-content,
body.site .package-sidebar,
body.site .inclusions-wrapper > div {
  border-radius: 14px;
  box-shadow: none;
  border: 1px solid var(--line);
  background: #fff;
}
body.site .package-main-content h1,
body.site .package-main-content h2,
body.site .package-main-content h3,
body.site .package-sidebar h3,
body.site .package-sidebar h4 { font-family: var(--display); font-weight: 400; color: var(--night); }
body.site .package-main-content p,
body.site .package-main-content li,
body.site .package-sidebar { font-family: var(--text); text-align: left; }
body.site .package-tag { background: var(--madder); color: #fff; border-radius: 999px; text-transform: none; }
body.site .price-tag,
body.site .package-sidebar .btn,
body.site .package-sidebar a.btn { color: var(--ochre); }
body.site .package-sidebar .btn,
body.site .package-call-assist + a,
body.site .package-sidebar button { border-radius: 999px; }
body.site .package-images-grid img { border-radius: 12px; }

/* ---------- Privacy / policy cards ---------- */
body.site .card.p-4 {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: none;
}
body.site .card.p-4 h2,
body.site .card.p-4 h3,
body.site .lead-intro + * h2 { font-family: var(--display); font-weight: 400; color: var(--night); }
body.site .card.p-4 p,
body.site .card.p-4 li,
body.site .lead-intro { font-family: var(--text); color: var(--ink-soft); text-align: left; }
body.site .contact-link { color: var(--ochre); }

/* ---------- Inner pages: tablet + mobile ---------- */
@media (max-width: 991px) {
  body.site .page-banner { padding: 120px 0 56px; }
  body.site .about-section,
  body.site .gallery-page-section,
  body.site .single-room-section { padding: 56px 0; }
  body.site .reception-image img,
  body.site .convention-image img { border-radius: 14px; aspect-ratio: 16 / 10; }
  body.site .single-room-sidebar { margin-top: 32px; }
}

/* ---------- Packages: remaining headings ---------- */
body.site .package-main-content h4,
body.site .package-main-content h5,
body.site .package-main-content h6,
body.site .package-sidebar h5 { font-family: var(--display); font-weight: 400; color: var(--night); }
body.site .package-main-content .text-center p { text-align: center; }

/* ---------- Blog (blog.css reads these tokens) ---------- */
body.site {
  --blog-accent: #b4601a;
  --blog-accent-dark: #8f4a12;
  --blog-ink: #2a2019;
  --blog-body: #5b4b3e;
  --blog-cream: #ead9b8;
  --blog-line: rgba(42, 32, 25, .16);
}
body.site .blog-modern__title,
body.site .post-card__title,
body.site .blog-empty h3,
body.site .blog-single__title,
body.site .blog-single__content h2,
body.site .blog-single__content h3,
body.site .blog-single__content h4,
body.site .blog-single__content h5,
body.site .blog-widget__title,
body.site .blog-cta h4,
body.site .blog-related__title { font-family: var(--display); font-weight: 400; }
body.site .blog-modern,
body.site .blog-single { font-family: var(--text); }
