/* Reading copy is justified across site pages; labels and controls retain their layout. */
html body main p:not(.section-label):not(.pkd-eyebrow):not(.pk-hint):not(.ot-script):not(.script-text):not([class*="label"]):not([class*="caption"]):not(#_):not(#_),
html body main li:not(nav li):not(.ot-values li):not(#_):not(#_) {
  text-align: justify !important;
  text-align-last: start;
  hyphens: auto;
  overflow-wrap: break-word;
}

/* Shared type scale. Keep these rules authoritative over legacy page styles. */
:root {
  --type-heading-font: 'Playfair Display', Georgia, serif;
  --type-heading-weight: 500;
  --type-heading-color: #494139;
  --type-body-font: 'DM Sans', Arial, sans-serif;
  --type-subheading-font: 'Caveat', cursive;
  --type-review-font: 'DM Sans', Arial, sans-serif;
  --type-h1: clamp(2rem, 1.4rem + 2.4vw, 2.56rem);   /* up to 40.96px */
  --type-h2: clamp(1.75rem, 1.3rem + 1.6vw, 2.4rem); /* 28 - 38.4px */
  --type-h3: 1.35rem;                                 /* 21.6px */
  --type-h4: 1.2rem;                                  /* 19.2px */
  --type-lead: 1.0625rem;                             /* 17px */
  --type-body: 1rem;                                  /* 16px */
  --type-small: .875rem;                              /* 14px */
  --type-label: .6875rem;                             /* 11px */
  --type-eyebrow: 1.65rem;                            /* 26.4px */
  --type-button: .75rem;                              /* 12px */
  --type-nav: .95rem;                                 /* 15.2px */
}
@media (max-width: 767px) {
  :root {
    --type-h3: 1.25rem;     /* 20px */
    --type-h4: 1.119rem;    /* 17.9px */
    --type-lead: 1rem;      /* 16px */
  }
}
html { font-size: 16px; }
body {
  font-family: var(--type-body-font) !important;
  font-size: var(--type-body) !important;
  font-weight: 400;
  line-height: 1.75;
}
/* Reset page-specific text sizes, including div/span copy and modal content.
   Icon glyphs retain their own sizing and font family. Headings and text roles
   below then apply the same scale everywhere, including nested text. */
body :where(*):not(:where(svg, svg *, [class*="fa-"], .fa, .fas, .far, .fab)) {
  font-size: inherit !important;
  font-family: inherit !important;
}
body :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--type-heading-font) !important;
  font-weight: var(--type-heading-weight) !important;
  letter-spacing: 0 !important;
  text-wrap: balance;
  white-space: normal !important;
  overflow-wrap: break-word;
}
body h1 { font-size: var(--type-h1) !important; line-height: 1.18 !important; }
body h2 { font-size: var(--type-h2) !important; line-height: 1.24 !important; }
body h3 { font-size: var(--type-h3) !important; line-height: 1.3 !important; }
body h4 { font-size: var(--type-h4) !important; line-height: 1.35 !important; }
body :is(h5, h6) { font-size: var(--type-body) !important; line-height: 1.4 !important; }
/* Paragraphs and reading copy use one size on every page. */
body p,
body main :is(ul, ol, li, blockquote, dd, dt),
body main details summary,
body main details summary > span:not([class*="num"]),
body main details > div {
  font-size: var(--type-body) !important;
  line-height: 1.75 !important;
}
body :is(.lead, p.lead) { font-size: var(--type-lead) !important; }
/* Serif for FAQ questions, quotes and large numerals. */
body main details summary,
body blockquote,
body :is(.mv-num, .rp-stats b, .pkg-rv-score b) {
  font-family: var(--type-heading-font) !important;
}
body :is(input, textarea, select) {
  font-family: var(--type-body-font) !important;
  font-size: var(--type-body) !important;
  line-height: 1.5 !important;
}
body main label {
  font-size: var(--type-small) !important;
  line-height: 1.5 !important;
}
/* Eyebrow: script. */
body .section-label {
  font-family: var(--type-subheading-font) !important;
  font-size: var(--type-eyebrow) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}
/* Label: small uppercase tags. */
body :is(.label, .tag, .badge, .ldr-x-tag) {
  font-size: var(--type-label) !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: .08em;
}
/* Shared secondary copy, separate from paragraphs and reading text. */
body :is(.archive-location, .archive-count, .archive-breadcrumb),
body :is(.post-meta, .bl-count, .blog-filter-label, figcaption, small) {
  font-size: var(--type-small) !important;
  line-height: 1.6 !important;
}

/* Buttons: 12px, 500, uppercase. */
body :is(button, [role="button"]),
body :is(.archive-link, .read-more-link, .rs-button, .rs-text-link,
         .faq-cta-button, .mobile-cta a, .filter-chip, .st-tab) {
  font-family: var(--type-body-font) !important;
  font-size: var(--type-button) !important;
  font-weight: 500 !important;
  text-transform: uppercase;
  letter-spacing: .06em;
  line-height: 1.5 !important;
}
/* Nav menu: 15.2px, 500, normal capitalisation. */
body nav a {
  font-family: var(--type-body-font) !important;
  font-size: var(--type-nav) !important;
  font-weight: 500 !important;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.5 !important;
}
body :is(input, textarea, select) {
  font-size: var(--type-body) !important;
}

/* Footer: serif headings 17.6px, DM Sans text 14px, bottom bar 12px. */
body .site-footer { font-size: var(--type-small) !important; }
body .site-footer :is(p, li, a, span) { font-size: var(--type-small) !important; }
body .site-footer h2,
body .site-footer h2.footer-brand-title {
  font-family: var(--type-heading-font) !important;
  font-size: 1.1rem !important;
  font-weight: var(--type-heading-weight) !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
}
body .site-footer :is(.footer-bottom, .footer-bottom *) { font-size: var(--type-button) !important; }

/* Google-style review cards. */
body :is([class*="rg-"], [class*="rg-"] *):not([class*="fa-"]):not(h1, h2, h3, h4, h5, h6, .section-label, .section-label *) {
  font-family: var(--type-review-font) !important;
}

/* Shared heading contrast across every page, including custom page headings. */
body :is(h1, h2, h3, h4, h5, h6) {
  color: var(--type-heading-color) !important;
}
/* Dark surfaces keep their readable light headings. */
body :is(.site-footer, .archive-cta, .pk-dark, .tr-sec--dark,
         .tr-wl-card, .tr-box, .tr-dist, .rp-head--dark, .rp-gcard,
         .ldr-x-dark, .rs-safari, .bg-forest-950, .bg-forest-900,
         .bg-forest-800, .text-white) :is(h1, h2, h3, h4, h5, h6),
body :is(h1, h2, h3, h4, h5, h6):is(.text-white, .text-sand-100, .text-sand-200) {
  color: #f6f1e8 !important;
}

/* ===== Heading lock: h1–h6 use the same scale on every page ===========
   The double :not(#_) lifts specificity above any page-level or ID-scoped
   heading rule, so no page can drift from the shared type scale. */
html body h1:not(#_):not(#_) { font-size: var(--type-h1) !important; line-height: 1.2 !important; letter-spacing: -.005em !important; }
html body h2:not(#_):not(#_) { font-size: var(--type-h2) !important; line-height: 1.25 !important; letter-spacing: -.005em !important; }
html body h3:not(#_):not(#_) { font-size: var(--type-h3) !important; line-height: 1.3 !important; letter-spacing: 0 !important; }
html body h4:not(#_):not(#_) { font-size: var(--type-h4) !important; line-height: 1.35 !important; letter-spacing: 0 !important; }
html body :is(h5, h6):not(#_):not(#_) { font-size: var(--type-body) !important; line-height: 1.4 !important; letter-spacing: 0 !important; }
/* Footer headings keep their compact size */
html body .site-footer h2:not(#_):not(#_) { font-size: 1.1rem !important; line-height: 1.3 !important; letter-spacing: 0 !important; }
html body .site-footer h2.footer-brand-title:not(#_):not(#_) { font-size: 1.1rem !important; }

/* Visual size helpers: keep the design when a heading's level changes for SEO outline. */
html body .h2-size:not(#_):not(#_) { font-size: var(--type-h2) !important; line-height: 1.25 !important; letter-spacing: -.005em !important; }
html body .h3-size:not(#_):not(#_) { font-size: var(--type-h3) !important; line-height: 1.3 !important; letter-spacing: 0 !important; }
html body .h4-size:not(#_):not(#_) { font-size: var(--type-h4) !important; line-height: 1.35 !important; letter-spacing: 0 !important; }

/* ===== Card descriptions: one size, two lines, same height on every page ===== */
html body :is(#stays .st-card p, .archive-card .archive-card-body > p:not(.archive-location), #blog-stage .bc-text):not(#_):not(#_) {
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  overflow: hidden;
  min-height: 3.4em;
  font-family: var(--type-body-font) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  text-align: left !important;
  hyphens: manual !important;
  -webkit-hyphens: manual !important;
}

/* ===== Long-form intro copy on archive pages sits on the body size ===== */
html body .archive-about-copy p:not(.section-label):not(#_):not(#_) { font-size: var(--type-body) !important; }

/* ===== Section eyebrows: every small label above a section heading uses the script style ===== */
html body :is(.section-label, .ot-label, .ldr-kicker, .mv-label):not(#_):not(#_),
html body :is(.section-label, .ot-label) > span:not([class*="fa-"]):not(#_):not(#_) {
  font-family: var(--type-subheading-font) !important;
  font-size: var(--type-eyebrow) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* ===== Section rhythm: one vertical spacing for every content section (desktop 40, mobile 30) ===== */
html body :is(.rp-sec, .rp-rev, .tr-sec, .ct-sec, #stays, #how-it-works, #journal, #faq, #team, #core-team,
              #top-reserve, #why-book, #mission-vision, #about-content,
              .bl-guide, .bl-topics, .bl-faq, .blog-newsletter, .bd-related):not(#_):not(#_) {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}
html body :is(.archive-band, .bd-body, .fq-body):not(#_):not(#_) { padding-bottom: 40px !important; }
html body .bl-stage:not(#_):not(#_) { padding-top: 132px !important; padding-bottom: 40px !important; }
@media (max-width: 767px) {
  html body :is(.rp-sec, .rp-rev, .tr-sec, .ct-sec, #stays, #how-it-works, #journal, #faq, #team, #core-team,
                #top-reserve, #why-book, #mission-vision, #about-content,
                .bl-guide, .bl-topics, .bl-faq, .blog-newsletter, .bd-related):not(#_):not(#_) {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  html body :is(.archive-band, .bd-body, .fq-body, .bl-stage):not(#_):not(#_) { padding-bottom: 30px !important; }
  html body .bl-stage:not(#_):not(#_) { padding-top: 104px !important; }
}

/* ===== Footer legal bar: readable on the forest photo ===== */
html body .site-footer .footer-legal:not(#_) { position: relative; }
html body .site-footer .footer-legal :is(a, p, span):not(#_) {
  font-size: 13.5px !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, .86) !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .75);
}
html body .site-footer .footer-legal a:hover:not(#_) { color: #e8bd55 !important; }
html body .site-footer .footer-legal span.text-\[\#e8bd55\]:not(#_) { color: #e8bd55 !important; }
html body .site-footer .footer-legal .flex > span:not(#_),
html body .site-footer .footer-legal p > span.mx-2:not(#_) { color: rgba(255, 255, 255, .35) !important; }

/* Pages with no photo banner behind the floating header get a solid dark header */
body.no-banner header > nav.site-nav { background: rgba(43, 33, 26, .96); }


/* ===== Tabs everywhere (home stays, archive pages, blog categories, resort rooms): bold, larger, dark ===== */
html body :is(#stays .st-tab, .resorts-tabs .resorts-tab, #blog-stage .filter-chip, .rp-tab):not(#_):not(#_) {
  font-family: var(--type-body-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  color: #2a1c13;
}
html body :is(#stays .st-tab, .resorts-tabs .resorts-tab, #blog-stage .filter-chip):hover:not(#_):not(#_) { color: #a57131; }
html body :is(#stays .st-tab.is-on, .resorts-tabs .resorts-tab.is-active, #blog-stage .filter-chip.active):not(#_):not(#_) { color: #2a1c13; }
html body :is(#stays .st-tab::after, .resorts-tabs .resorts-tab::after) { height: 3px; }
html body :is(#stays .st-tab:not(.is-on), .resorts-tabs .resorts-tab:not(.is-active), #blog-stage .filter-chip:not(.active)):hover::after { transform: scaleX(0) !important; }
html body .rp-tab[aria-selected="true"]:not(#_):not(#_) { color: #fff; }
@media (max-width: 599px) { html body :is(#stays .st-tab, .resorts-tabs .resorts-tab, #blog-stage .filter-chip, .rp-tab):not(#_):not(#_) { font-size: 12.5px !important; letter-spacing: .05em !important; } }