{"id":40,"date":"2026-03-23T20:57:50","date_gmt":"2026-03-23T20:57:50","guid":{"rendered":"https:\/\/apilgrimsrestguesthouse.com\/?page_id=40"},"modified":"2026-03-23T21:15:31","modified_gmt":"2026-03-23T21:15:31","slug":"home","status":"publish","type":"page","link":"https:\/\/apilgrimsrestguesthouse.com\/","title":{"rendered":"A Pilgrim&#8217;s Rest Guesthouse"},"content":{"rendered":"<p><!DOCTYPE html><br \/>\n<html lang=\"en\"><br \/>\n<head><\/p>\n<p><meta charset=\"UTF-8\"><br \/>\n<script>\n\/\/ Force HTTPS redirect\nif(window.location.protocol !== 'https:'){\n  window.location.replace('https:\/\/' + window.location.host + window.location.pathname + window.location.search);\n}\n<\/script><br \/>\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, viewport-fit=cover\"><br \/>\n<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"><br \/>\n<title>A Pilgrim&#8217;s Rest Guesthouse | Graskop, Mpumalanga<\/title><br \/>\n<meta name=\"description\" content=\"A charming heritage guesthouse in Graskop on the Panorama Route, Mpumalanga. Beautifully appointed Victorian-style rooms, honesty bar, breakfast, and easy access to God's Window, Blyde River Canyon, and Kruger National Park.\"><br \/>\n<meta name=\"theme-color\" content=\"#2d4a3e\"><\/p>\n<p><!-- Open Graph \/ Social --><br \/>\n<meta property=\"og:title\" content=\"A Pilgrim's Rest Guesthouse | Graskop, Mpumalanga\"><br \/>\n<meta property=\"og:description\" content=\"Your home away from home on the Panorama Route. Heritage charm, comfortable rooms, and stunning natural attractions at your doorstep.\"><br \/>\n<meta property=\"og:image\" content=\".\/assets\/hero.jpg\"><br \/>\n<meta property=\"og:type\" content=\"website\"><br \/>\n<meta property=\"og:url\" content=\"https:\/\/www.apilgrimsrestguesthouse.co.za\"><\/p>\n<p><!-- Apple mobile --><br \/>\n<meta name=\"apple-mobile-web-app-capable\" content=\"yes\"><br \/>\n<meta name=\"apple-mobile-web-app-status-bar-style\" content=\"black-translucent\"><\/p>\n<p><!-- Fonts -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&#038;family=Source+Sans+3:wght@300;400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n<p><!-- Styles --><\/p>\n<style>\n\/* base.css *\/\n*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }<\/p>\n<p>html {\n  -moz-text-size-adjust: none;\n  -webkit-text-size-adjust: none;\n  text-size-adjust: none;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  text-rendering: optimizeLegibility;\n  scroll-behavior: smooth;\n  hanging-punctuation: first last;\n  scroll-padding-top: 80px;\n}<\/p>\n<p>body {\n  min-height: 100dvh;\n  line-height: 1.6;\n  font-family: var(--font-body, sans-serif);\n  font-size: var(--text-base);\n  color: var(--color-text);\n  background-color: var(--color-bg);\n}<\/p>\n<p>img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }\nul[role=\"list\"], ol[role=\"list\"] { list-style: none; }\ninput, button, textarea, select { font: inherit; color: inherit; }<\/p>\n<p>h1, h2, h3, h4, h5, h6 { text-wrap: balance; line-height: 1.15; }\np, li, figcaption { text-wrap: pretty; max-width: 72ch; }<\/p>\n<p>::selection {\n  background: oklch(from var(--color-primary) l c h \/ 0.25);\n  color: var(--color-text);\n}<\/p>\n<p>:focus-visible {\n  outline: 2px solid var(--color-primary);\n  outline-offset: 3px;\n  border-radius: var(--radius-sm);\n}<\/p>\n<p>@media (prefers-reduced-motion: reduce) {\n  *, *::before, *::after {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.01ms !important;\n    scroll-behavior: auto !important;\n  }\n}<\/p>\n<p>button { cursor: pointer; background: none; border: none; }\ntable { border-collapse: collapse; width: 100%; }<\/p>\n<p>a, button, [role=\"button\"], [role=\"link\"], input, textarea, select {\n  transition: color var(--transition-interactive),\n              background var(--transition-interactive),\n              border-color var(--transition-interactive),\n              box-shadow var(--transition-interactive);\n}<\/p>\n<p>.sr-only {\n  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;\n  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0;\n}<\/p>\n<p>\/* ========================================\n   A Pilgrim's Rest Guesthouse \u2014 Style\n   Heritage Victorian \/ Colonial Aesthetic\n   ======================================== *\/<\/p>\n<p>\/* --- DESIGN TOKENS --- *\/\n:root {\n  \/* Type scale *\/\n  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);\n  --text-sm:   clamp(0.875rem, 0.8rem  + 0.35vw, 1rem);\n  --text-base: clamp(1rem,     0.95rem + 0.25vw, 1.125rem);\n  --text-lg:   clamp(1.125rem, 1rem    + 0.75vw, 1.5rem);\n  --text-xl:   clamp(1.5rem,   1.2rem  + 1.25vw, 2.25rem);\n  --text-2xl:  clamp(2rem,     1.2rem  + 2.5vw,  3.5rem);\n  --text-3xl:  clamp(2.5rem,   1rem    + 4vw,    5rem);<\/p>\n<p>  \/* Spacing *\/\n  --space-1:  0.25rem;\n  --space-2:  0.5rem;\n  --space-3:  0.75rem;\n  --space-4:  1rem;\n  --space-5:  1.25rem;\n  --space-6:  1.5rem;\n  --space-8:  2rem;\n  --space-10: 2.5rem;\n  --space-12: 3rem;\n  --space-16: 4rem;\n  --space-20: 5rem;\n  --space-24: 6rem;\n  --space-32: 8rem;<\/p>\n<p>  \/* Fonts *\/\n  --font-display: 'Playfair Display', 'Georgia', serif;\n  --font-body: 'Source Sans 3', 'Helvetica Neue', sans-serif;<\/p>\n<p>  \/* Radius *\/\n  --radius-sm: 0.25rem;\n  --radius-md: 0.5rem;\n  --radius-lg: 0.75rem;\n  --radius-xl: 1rem;<\/p>\n<p>  \/* Transitions *\/\n  --transition-interactive: 200ms cubic-bezier(0.16, 1, 0.3, 1);<\/p>\n<p>  \/* Content widths *\/\n  --content-narrow: 640px;\n  --content-default: 960px;\n  --content-wide: 1200px;\n}<\/p>\n<p>\/* --- LIGHT MODE (default) --- *\/\n:root, [data-theme=\"light\"] {\n  --color-bg:             #FAF8F3;\n  --color-surface:        #FFFFFF;\n  --color-surface-2:      #F5F1E8;\n  --color-surface-offset: #EDE9DF;\n  --color-divider:        #D6CFC2;\n  --color-border:         #C9C0B0;\n  --color-text:           #2C2A24;\n  --color-text-muted:     #6B6558;\n  --color-text-faint:     #9E9787;\n  --color-text-inverse:   #FAF8F3;\n  --color-primary:        #2F5F4F;\n  --color-primary-hover:  #1E4438;\n  --color-primary-active: #153027;\n  --color-primary-light:  #E8F0EC;\n  --color-accent:         #C6993B;\n  --color-accent-hover:   #A67E2E;\n  --color-accent-light:   #FBF5E8;\n  --shadow-sm: 0 1px 3px rgba(44, 42, 36, 0.06);\n  --shadow-md: 0 4px 12px rgba(44, 42, 36, 0.08);\n  --shadow-lg: 0 12px 32px rgba(44, 42, 36, 0.12);\n}<\/p>\n<p>\/* --- DARK MODE --- *\/\n[data-theme=\"dark\"] {\n  --color-bg:             #1A1916;\n  --color-surface:        #242320;\n  --color-surface-2:      #2A2925;\n  --color-surface-offset: #1E1D1A;\n  --color-divider:        #3A3832;\n  --color-border:         #4A4840;\n  --color-text:           #E8E4DA;\n  --color-text-muted:     #A09B8E;\n  --color-text-faint:     #6B6558;\n  --color-text-inverse:   #1A1916;\n  --color-primary:        #5A9E88;\n  --color-primary-hover:  #6DB69C;\n  --color-primary-active: #81C8AE;\n  --color-primary-light:  #2A3430;\n  --color-accent:         #D4AA52;\n  --color-accent-hover:   #E0BD6E;\n  --color-accent-light:   #3A3428;\n  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.2);\n  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);\n  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);\n}<\/p>\n<p>@media (prefers-color-scheme: dark) {\n  :root:not([data-theme]) {\n    --color-bg:             #1A1916;\n    --color-surface:        #242320;\n    --color-surface-2:      #2A2925;\n    --color-surface-offset: #1E1D1A;\n    --color-divider:        #3A3832;\n    --color-border:         #4A4840;\n    --color-text:           #E8E4DA;\n    --color-text-muted:     #A09B8E;\n    --color-text-faint:     #6B6558;\n    --color-text-inverse:   #1A1916;\n    --color-primary:        #5A9E88;\n    --color-primary-hover:  #6DB69C;\n    --color-primary-active: #81C8AE;\n    --color-primary-light:  #2A3430;\n    --color-accent:         #D4AA52;\n    --color-accent-hover:   #E0BD6E;\n    --color-accent-light:   #3A3428;\n    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.2);\n    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);\n    --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);\n  }\n}<\/p>\n<p>\/* --- LAYOUT --- *\/\n.container {\n  width: 100%;\n  max-width: var(--content-wide);\n  margin-inline: auto;\n  padding-inline: var(--space-6);\n}<\/p>\n<p>.container--narrow {\n  max-width: var(--content-default);\n}<\/p>\n<p>section {\n  padding-block: clamp(var(--space-12), 6vw, var(--space-24));\n}<\/p>\n<p>\/* --- HEADER \/ NAV --- *\/\n.header {\n  position: sticky;\n  top: 0;\n  z-index: 100;\n  background: var(--color-bg);\n  border-bottom: 1px solid var(--color-divider);\n  transition: box-shadow 0.3s ease, background 0.3s ease;\n}<\/p>\n<p>.header--scrolled {\n  box-shadow: var(--shadow-md);\n}<\/p>\n<p>.header__inner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding-block: var(--space-3);\n  max-width: var(--content-wide);\n  margin-inline: auto;\n  padding-inline: var(--space-6);\n}<\/p>\n<p>.header__logo {\n  display: flex;\n  align-items: center;\n  gap: var(--space-3);\n  text-decoration: none;\n  color: var(--color-text);\n}<\/p>\n<p>.header__logo img {\n  height: 44px;\n  width: auto;\n  border-radius: var(--radius-sm);\n}<\/p>\n<p>.header__logo-text {\n  font-family: var(--font-display);\n  font-size: var(--text-lg);\n  font-weight: 700;\n  color: var(--color-primary);\n  line-height: 1.2;\n}<\/p>\n<p>.header__logo-text span {\n  display: block;\n  font-size: var(--text-xs);\n  font-family: var(--font-body);\n  font-weight: 400;\n  color: var(--color-text-muted);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}<\/p>\n<p>.nav {\n  display: flex;\n  align-items: center;\n  gap: var(--space-1);\n}<\/p>\n<p>.nav__link {\n  font-size: var(--text-sm);\n  color: var(--color-text-muted);\n  text-decoration: none;\n  padding: var(--space-2) var(--space-3);\n  border-radius: var(--radius-md);\n  font-weight: 500;\n  letter-spacing: 0.01em;\n}<\/p>\n<p>.nav__link:hover,\n.nav__link:focus-visible {\n  color: var(--color-primary);\n  background: var(--color-primary-light);\n}<\/p>\n<p>.nav__link--cta {\n  background: var(--color-primary);\n  color: var(--color-text-inverse);\n  font-weight: 600;\n  padding: var(--space-2) var(--space-4);\n}<\/p>\n<p>.nav__link--cta:hover {\n  background: var(--color-primary-hover);\n  color: var(--color-text-inverse);\n}<\/p>\n<p>\/* Mobile nav toggle *\/\n.nav-toggle {\n  display: none;\n  flex-direction: column;\n  gap: 5px;\n  padding: var(--space-2);\n  cursor: pointer;\n  z-index: 110;\n}<\/p>\n<p>.nav-toggle span {\n  display: block;\n  width: 24px;\n  height: 2px;\n  background: var(--color-text);\n  border-radius: 2px;\n  transition: transform 0.3s ease, opacity 0.3s ease;\n}<\/p>\n<p>.nav-toggle.active span:nth-child(1) {\n  transform: translateY(7px) rotate(45deg);\n}<\/p>\n<p>.nav-toggle.active span:nth-child(2) {\n  opacity: 0;\n}<\/p>\n<p>.nav-toggle.active span:nth-child(3) {\n  transform: translateY(-7px) rotate(-45deg);\n}<\/p>\n<p>.theme-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 36px;\n  height: 36px;\n  border-radius: var(--radius-md);\n  color: var(--color-text-muted);\n  cursor: pointer;\n}<\/p>\n<p>.theme-toggle:hover {\n  background: var(--color-surface-2);\n  color: var(--color-text);\n}<\/p>\n<p>@media (max-width: 860px) {\n  .nav-toggle {\n    display: flex;\n  }<\/p>\n<p>  .nav {\n    position: fixed;\n    top: 0;\n    right: -100%;\n    width: 280px;\n    height: 100vh;\n    height: 100dvh;\n    flex-direction: column;\n    align-items: stretch;\n    padding: var(--space-20) var(--space-6) var(--space-8);\n    background: var(--color-bg);\n    border-left: 1px solid var(--color-divider);\n    box-shadow: var(--shadow-lg);\n    transition: right 0.35s cubic-bezier(0.16, 1, 0.3, 1);\n    z-index: 105;\n    gap: var(--space-1);\n  }<\/p>\n<p>  .nav.open {\n    right: 0;\n  }<\/p>\n<p>  .nav__link {\n    font-size: var(--text-base);\n    padding: var(--space-3) var(--space-4);\n  }<\/p>\n<p>  .nav__link--cta {\n    text-align: center;\n    margin-top: var(--space-4);\n  }\n}<\/p>\n<p>\/* --- HERO SECTION --- *\/\n.hero {\n  position: relative;\n  min-height: 85vh;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  overflow: hidden;\n  padding: 0;\n}<\/p>\n<p>.hero__bg {\n  position: absolute;\n  inset: 0;\n  z-index: 0;\n}<\/p>\n<p>.hero__bg img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center 30%;\n}<\/p>\n<p>.hero__overlay {\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(\n    to top,\n    rgba(26, 25, 22, 0.85) 0%,\n    rgba(26, 25, 22, 0.5) 35%,\n    rgba(26, 25, 22, 0.15) 70%,\n    transparent 100%\n  );\n}<\/p>\n<p>.hero__content {\n  position: relative;\n  z-index: 2;\n  text-align: center;\n  padding: var(--space-8) var(--space-6) var(--space-12);\n  max-width: 800px;\n  color: #FAF8F3;\n}<\/p>\n<p>.hero__badge {\n  display: inline-block;\n  font-size: var(--text-xs);\n  font-weight: 600;\n  letter-spacing: 0.15em;\n  text-transform: uppercase;\n  color: var(--color-accent);\n  margin-bottom: var(--space-4);\n}<\/p>\n<p>.hero__title {\n  font-family: var(--font-display);\n  font-size: var(--text-3xl);\n  font-weight: 700;\n  line-height: 1.05;\n  margin-bottom: var(--space-4);\n  color: #FAF8F3;\n}<\/p>\n<p>.hero__subtitle {\n  font-size: var(--text-lg);\n  font-weight: 300;\n  color: rgba(250, 248, 243, 0.85);\n  margin-bottom: var(--space-8);\n  max-width: 600px;\n  margin-inline: auto;\n}<\/p>\n<p>.hero__actions {\n  display: flex;\n  gap: var(--space-4);\n  justify-content: center;\n  flex-wrap: wrap;\n}<\/p>\n<p>\/* --- BUTTONS --- *\/\n.btn {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-2);\n  font-size: var(--text-sm);\n  font-weight: 600;\n  padding: var(--space-3) var(--space-6);\n  border-radius: var(--radius-md);\n  text-decoration: none;\n  cursor: pointer;\n  border: none;\n  line-height: 1.4;\n  white-space: nowrap;\n}<\/p>\n<p>.btn--primary {\n  background: var(--color-primary);\n  color: var(--color-text-inverse);\n}<\/p>\n<p>.btn--primary:hover {\n  background: var(--color-primary-hover);\n}<\/p>\n<p>.btn--accent {\n  background: var(--color-accent);\n  color: #2C2A24;\n}<\/p>\n<p>.btn--accent:hover {\n  background: var(--color-accent-hover);\n}<\/p>\n<p>.btn--outline {\n  background: transparent;\n  color: #FAF8F3;\n  border: 1.5px solid rgba(250, 248, 243, 0.4);\n}<\/p>\n<p>.btn--outline:hover {\n  background: rgba(250, 248, 243, 0.1);\n  border-color: rgba(250, 248, 243, 0.7);\n}<\/p>\n<p>.btn--outline-dark {\n  background: transparent;\n  color: var(--color-primary);\n  border: 1.5px solid var(--color-border);\n}<\/p>\n<p>.btn--outline-dark:hover {\n  background: var(--color-primary-light);\n  border-color: var(--color-primary);\n}<\/p>\n<p>\/* --- SECTION STYLES --- *\/\n.section-header {\n  text-align: center;\n  margin-bottom: clamp(var(--space-8), 4vw, var(--space-16));\n}<\/p>\n<p>.section-header__badge {\n  display: inline-block;\n  font-size: var(--text-xs);\n  font-weight: 600;\n  letter-spacing: 0.15em;\n  text-transform: uppercase;\n  color: var(--color-accent);\n  margin-bottom: var(--space-3);\n}<\/p>\n<p>.section-header__title {\n  font-family: var(--font-display);\n  font-size: var(--text-2xl);\n  font-weight: 700;\n  color: var(--color-text);\n  margin-bottom: var(--space-3);\n}<\/p>\n<p>.section-header__desc {\n  font-size: var(--text-base);\n  color: var(--color-text-muted);\n  max-width: 600px;\n  margin-inline: auto;\n}<\/p>\n<p>.section--alt {\n  background: var(--color-surface-2);\n}<\/p>\n<p>\/* Decorative line *\/\n.divider-line {\n  width: 60px;\n  height: 2px;\n  background: var(--color-accent);\n  margin: var(--space-4) auto;\n  border-radius: 1px;\n}<\/p>\n<p>\/* --- WELCOME SECTION --- *\/\n.welcome {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: clamp(var(--space-8), 4vw, var(--space-16));\n  align-items: start;\n}<\/p>\n<p>.welcome__text h2 {\n  font-family: var(--font-display);\n  font-size: var(--text-xl);\n  margin-bottom: var(--space-4);\n  color: var(--color-text);\n}<\/p>\n<p>.welcome__text p {\n  color: var(--color-text-muted);\n  margin-bottom: var(--space-4);\n  line-height: 1.7;\n}<\/p>\n<p>.welcome__features {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: var(--space-4);\n  margin-top: var(--space-6);\n}<\/p>\n<p>.feature-card {\n  padding: var(--space-5);\n  background: var(--color-surface);\n  border-radius: var(--radius-lg);\n  border: 1px solid var(--color-divider);\n}<\/p>\n<p>.feature-card__icon {\n  font-size: 1.5rem;\n  margin-bottom: var(--space-2);\n}<\/p>\n<p>.feature-card__title {\n  font-size: var(--text-sm);\n  font-weight: 700;\n  color: var(--color-text);\n  margin-bottom: var(--space-1);\n}<\/p>\n<p>.feature-card__desc {\n  font-size: var(--text-xs);\n  color: var(--color-text-muted);\n  line-height: 1.5;\n}<\/p>\n<p>.welcome__gallery {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: var(--space-3);\n}<\/p>\n<p>.welcome__gallery img {\n  width: 100%;\n  height: 200px;\n  object-fit: cover;\n  border-radius: var(--radius-lg);\n}<\/p>\n<p>.welcome__gallery img:first-child {\n  grid-column: 1 \/ -1;\n  height: 280px;\n}<\/p>\n<p>@media (max-width: 768px) {\n  .welcome {\n    grid-template-columns: 1fr;\n  }\n  .welcome__gallery {\n    grid-template-columns: 1fr 1fr;\n  }\n  .welcome__gallery img:first-child {\n    height: 220px;\n  }\n}<\/p>\n<p>\/* --- ROOMS SECTION --- *\/\n.rooms-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: clamp(var(--space-6), 3vw, var(--space-8));\n}<\/p>\n<p>.room-card {\n  background: var(--color-surface);\n  border-radius: var(--radius-xl);\n  overflow: hidden;\n  border: 1px solid var(--color-divider);\n  transition: box-shadow 0.3s ease, transform 0.3s ease;\n}<\/p>\n<p>.room-card:hover {\n  box-shadow: var(--shadow-lg);\n  transform: translateY(-2px);\n}<\/p>\n<p>.room-card__gallery {\n  position: relative;\n  aspect-ratio: 4\/3;\n  overflow: hidden;\n}<\/p>\n<p>.room-card__gallery img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  position: absolute;\n  inset: 0;\n  opacity: 0;\n  transition: opacity 0.6s ease;\n}<\/p>\n<p>.room-card__gallery img.active {\n  opacity: 1;\n}<\/p>\n<p>.room-card__dots {\n  position: absolute;\n  bottom: var(--space-3);\n  left: 50%;\n  transform: translateX(-50%);\n  display: flex;\n  gap: var(--space-2);\n  z-index: 3;\n}<\/p>\n<p>.room-card__dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: rgba(255,255,255,0.5);\n  cursor: pointer;\n  border: none;\n  padding: 0;\n  transition: background 0.2s ease;\n}<\/p>\n<p>.room-card__dot.active {\n  background: #fff;\n}<\/p>\n<p>.room-card__gallery-nav {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  background: rgba(255,255,255,0.85);\n  border: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 3;\n  opacity: 0;\n  transition: opacity 0.2s ease;\n  color: #2C2A24;\n  font-size: 14px;\n}<\/p>\n<p>.room-card:hover .room-card__gallery-nav {\n  opacity: 1;\n}<\/p>\n<p>.room-card__gallery-nav--prev { left: var(--space-3); }\n.room-card__gallery-nav--next { right: var(--space-3); }<\/p>\n<p>.room-card__body {\n  padding: var(--space-5) var(--space-6);\n}<\/p>\n<p>.room-card__name {\n  font-family: var(--font-display);\n  font-size: var(--text-lg);\n  font-weight: 700;\n  color: var(--color-text);\n  margin-bottom: var(--space-2);\n}<\/p>\n<p>.room-card__desc {\n  font-size: var(--text-sm);\n  color: var(--color-text-muted);\n  margin-bottom: var(--space-4);\n  line-height: 1.6;\n}<\/p>\n<p>.room-card__link {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--space-2);\n  font-size: var(--text-sm);\n  font-weight: 600;\n  color: var(--color-primary);\n  text-decoration: none;\n}<\/p>\n<p>.room-card__link:hover {\n  color: var(--color-primary-hover);\n}<\/p>\n<p>.room-card__link svg {\n  width: 16px;\n  height: 16px;\n  transition: transform 0.2s ease;\n}<\/p>\n<p>.room-card__link:hover svg {\n  transform: translateX(3px);\n}<\/p>\n<p>@media (max-width: 768px) {\n  .rooms-grid {\n    grid-template-columns: 1fr;\n  }\n}<\/p>\n<p>\/* --- DINING SECTION --- *\/\n.dining-grid {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: clamp(var(--space-8), 4vw, var(--space-16));\n  align-items: start;\n}<\/p>\n<p>.dining-info h3 {\n  font-family: var(--font-display);\n  font-size: var(--text-lg);\n  color: var(--color-text);\n  margin-bottom: var(--space-3);\n}<\/p>\n<p>.dining-info p {\n  font-size: var(--text-base);\n  color: var(--color-text-muted);\n  margin-bottom: var(--space-4);\n  line-height: 1.7;\n}<\/p>\n<p>.dining-detail {\n  display: flex;\n  gap: var(--space-3);\n  align-items: flex-start;\n  padding: var(--space-4);\n  background: var(--color-surface);\n  border-radius: var(--radius-lg);\n  border: 1px solid var(--color-divider);\n  margin-bottom: var(--space-3);\n}<\/p>\n<p>.dining-detail__icon {\n  font-size: 1.25rem;\n  flex-shrink: 0;\n  margin-top: 2px;\n}<\/p>\n<p>.dining-detail__text strong {\n  display: block;\n  font-size: var(--text-sm);\n  color: var(--color-text);\n  margin-bottom: var(--space-1);\n}<\/p>\n<p>.dining-detail__text span {\n  font-size: var(--text-xs);\n  color: var(--color-text-muted);\n}<\/p>\n<p>.menu-images {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: var(--space-4);\n}<\/p>\n<p>.menu-images img {\n  width: 100%;\n  border-radius: var(--radius-lg);\n  border: 1px solid var(--color-divider);\n  box-shadow: var(--shadow-sm);\n}<\/p>\n<p>.restaurants {\n  margin-top: var(--space-8);\n}<\/p>\n<p>.restaurant-card {\n  display: flex;\n  gap: var(--space-4);\n  padding: var(--space-4) var(--space-5);\n  background: var(--color-surface);\n  border-radius: var(--radius-lg);\n  border: 1px solid var(--color-divider);\n  margin-bottom: var(--space-3);\n  align-items: flex-start;\n}<\/p>\n<p>.restaurant-card__name {\n  font-size: var(--text-sm);\n  font-weight: 700;\n  color: var(--color-text);\n  margin-bottom: var(--space-1);\n}<\/p>\n<p>.restaurant-card__details {\n  font-size: var(--text-xs);\n  color: var(--color-text-muted);\n  line-height: 1.6;\n}<\/p>\n<p>@media (max-width: 768px) {\n  .dining-grid {\n    grid-template-columns: 1fr;\n  }\n  .menu-images {\n    grid-template-columns: 1fr;\n  }\n}<\/p>\n<p>\/* --- ATTRACTIONS SECTION --- *\/\n.attractions-intro {\n  text-align: center;\n  max-width: 680px;\n  margin: 0 auto var(--space-10);\n}<\/p>\n<p>.attractions-intro p {\n  color: var(--color-text-muted);\n  font-size: var(--text-base);\n  line-height: 1.7;\n  margin-inline: auto;\n}<\/p>\n<p>.attractions-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: var(--space-4);\n  margin-bottom: var(--space-10);\n}<\/p>\n<p>.attraction-card {\n  padding: var(--space-5);\n  background: var(--color-surface);\n  border-radius: var(--radius-lg);\n  border: 1px solid var(--color-divider);\n  transition: box-shadow 0.2s ease;\n}<\/p>\n<p>.attraction-card:hover {\n  box-shadow: var(--shadow-md);\n}<\/p>\n<p>.attraction-card__name {\n  font-family: var(--font-display);\n  font-size: var(--text-sm);\n  font-weight: 700;\n  color: var(--color-text);\n  margin-bottom: var(--space-1);\n}<\/p>\n<p>.attraction-card__distance {\n  font-size: var(--text-xs);\n  color: var(--color-accent);\n  font-weight: 600;\n  margin-bottom: var(--space-2);\n}<\/p>\n<p>.attraction-card__desc {\n  font-size: var(--text-xs);\n  color: var(--color-text-muted);\n  line-height: 1.5;\n}<\/p>\n<p>.kruger-section {\n  background: var(--color-primary);\n  border-radius: var(--radius-xl);\n  padding: var(--space-8);\n  color: var(--color-text-inverse);\n  margin-bottom: var(--space-8);\n}<\/p>\n<p>.kruger-section h3 {\n  font-family: var(--font-display);\n  font-size: var(--text-xl);\n  margin-bottom: var(--space-4);\n  color: var(--color-text-inverse);\n}<\/p>\n<p>.kruger-gates {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));\n  gap: var(--space-3);\n}<\/p>\n<p>.kruger-gate {\n  padding: var(--space-3) var(--space-4);\n  background: rgba(255,255,255,0.1);\n  border-radius: var(--radius-md);\n  font-size: var(--text-sm);\n  color: rgba(250, 248, 243, 0.9);\n}<\/p>\n<p>.kruger-gate strong {\n  display: block;\n  color: #FAF8F3;\n  font-weight: 700;\n  margin-bottom: var(--space-1);\n}<\/p>\n<p>.map-container {\n  border-radius: var(--radius-xl);\n  overflow: hidden;\n  border: 1px solid var(--color-divider);\n  height: 400px;\n  box-shadow: var(--shadow-md);\n}<\/p>\n<p>.map-container iframe {\n  width: 100%;\n  height: 100%;\n  border: none;\n}<\/p>\n<p>\/* --- HISTORY SECTION --- *\/\n.history-content {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: clamp(var(--space-8), 4vw, var(--space-16));\n  align-items: center;\n}<\/p>\n<p>.history-text h2 {\n  font-family: var(--font-display);\n  font-size: var(--text-xl);\n  color: var(--color-text);\n  margin-bottom: var(--space-4);\n}<\/p>\n<p>.history-text p {\n  color: var(--color-text-muted);\n  line-height: 1.7;\n  margin-bottom: var(--space-4);\n}<\/p>\n<p>.history-image {\n  border-radius: var(--radius-xl);\n  overflow: hidden;\n}<\/p>\n<p>.history-image img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: var(--radius-xl);\n}<\/p>\n<p>@media (max-width: 768px) {\n  .history-content {\n    grid-template-columns: 1fr;\n  }\n}<\/p>\n<p>\/* --- CONTACT SECTION --- *\/\n.contact-grid {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: clamp(var(--space-8), 4vw, var(--space-16));\n}<\/p>\n<p>.contact-info h3 {\n  font-family: var(--font-display);\n  font-size: var(--text-lg);\n  color: var(--color-text);\n  margin-bottom: var(--space-4);\n}<\/p>\n<p>.contact-item {\n  display: flex;\n  gap: var(--space-3);\n  margin-bottom: var(--space-4);\n  align-items: flex-start;\n}<\/p>\n<p>.contact-item__icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--color-primary-light);\n  border-radius: var(--radius-md);\n  flex-shrink: 0;\n  color: var(--color-primary);\n}<\/p>\n<p>.contact-item__text strong {\n  display: block;\n  font-size: var(--text-sm);\n  color: var(--color-text);\n  margin-bottom: var(--space-1);\n}<\/p>\n<p>.contact-item__text span,\n.contact-item__text a {\n  font-size: var(--text-sm);\n  color: var(--color-text-muted);\n  text-decoration: none;\n}<\/p>\n<p>.contact-item__text a:hover {\n  color: var(--color-primary);\n}<\/p>\n<p>.emergency-card {\n  background: var(--color-surface);\n  border-radius: var(--radius-xl);\n  padding: var(--space-6);\n  border: 1px solid var(--color-divider);\n}<\/p>\n<p>.emergency-card h3 {\n  font-family: var(--font-display);\n  font-size: var(--text-lg);\n  color: var(--color-text);\n  margin-bottom: var(--space-4);\n  display: flex;\n  align-items: center;\n  gap: var(--space-2);\n}<\/p>\n<p>.emergency-item {\n  display: flex;\n  justify-content: space-between;\n  padding: var(--space-3) 0;\n  border-bottom: 1px solid var(--color-divider);\n  font-size: var(--text-sm);\n}<\/p>\n<p>.emergency-item:last-child {\n  border-bottom: none;\n}<\/p>\n<p>.emergency-item__name {\n  color: var(--color-text);\n  font-weight: 500;\n}<\/p>\n<p>.emergency-item__number a {\n  color: var(--color-primary);\n  text-decoration: none;\n  font-weight: 600;\n}<\/p>\n<p>.emergency-item__number a:hover {\n  color: var(--color-primary-hover);\n}<\/p>\n<p>.booking-cta {\n  background: var(--color-primary);\n  border-radius: var(--radius-xl);\n  padding: var(--space-8);\n  text-align: center;\n  margin-top: clamp(var(--space-8), 4vw, var(--space-16));\n}<\/p>\n<p>.booking-cta h3 {\n  font-family: var(--font-display);\n  font-size: var(--text-xl);\n  color: var(--color-text-inverse);\n  margin-bottom: var(--space-3);\n}<\/p>\n<p>.booking-cta p {\n  color: rgba(250, 248, 243, 0.8);\n  margin-bottom: var(--space-6);\n  margin-inline: auto;\n}<\/p>\n<p>.booking-cta__buttons {\n  display: flex;\n  gap: var(--space-4);\n  justify-content: center;\n  flex-wrap: wrap;\n}<\/p>\n<p>.btn--white {\n  background: #FAF8F3;\n  color: var(--color-primary);\n  font-weight: 700;\n}<\/p>\n<p>.btn--white:hover {\n  background: #fff;\n}<\/p>\n<p>.btn--outline-white {\n  background: transparent;\n  color: #FAF8F3;\n  border: 1.5px solid rgba(250, 248, 243, 0.4);\n}<\/p>\n<p>.btn--outline-white:hover {\n  background: rgba(250, 248, 243, 0.1);\n  border-color: rgba(250, 248, 243, 0.7);\n}<\/p>\n<p>@media (max-width: 768px) {\n  .contact-grid {\n    grid-template-columns: 1fr;\n  }\n}<\/p>\n<p>\/* --- FOOTER --- *\/\n.footer {\n  background: var(--color-surface-2);\n  border-top: 1px solid var(--color-divider);\n  padding-block: var(--space-10) var(--space-6);\n}<\/p>\n<p>.footer__inner {\n  display: grid;\n  grid-template-columns: 2fr 1fr 1fr;\n  gap: var(--space-8);\n  margin-bottom: var(--space-8);\n}<\/p>\n<p>.footer__brand p {\n  color: var(--color-text-muted);\n  font-size: var(--text-sm);\n  margin-top: var(--space-3);\n  max-width: 360px;\n  line-height: 1.6;\n}<\/p>\n<p>.footer h4 {\n  font-family: var(--font-display);\n  font-size: var(--text-sm);\n  font-weight: 700;\n  color: var(--color-text);\n  margin-bottom: var(--space-4);\n}<\/p>\n<p>.footer__links {\n  list-style: none;\n  padding: 0;\n}<\/p>\n<p>.footer__links li {\n  margin-bottom: var(--space-2);\n}<\/p>\n<p>.footer__links a {\n  font-size: var(--text-sm);\n  color: var(--color-text-muted);\n  text-decoration: none;\n}<\/p>\n<p>.footer__links a:hover {\n  color: var(--color-primary);\n}<\/p>\n<p>.footer__bottom {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-top: var(--space-6);\n  border-top: 1px solid var(--color-divider);\n  font-size: var(--text-xs);\n  color: var(--color-text-faint);\n}<\/p>\n<p>.footer__bottom a {\n  color: var(--color-text-muted);\n  text-decoration: none;\n}<\/p>\n<p>.footer__bottom a:hover {\n  color: var(--color-primary);\n}<\/p>\n<p>@media (max-width: 768px) {\n  .footer__inner {\n    grid-template-columns: 1fr;\n    gap: var(--space-6);\n  }\n  .footer__bottom {\n    flex-direction: column;\n    gap: var(--space-3);\n    text-align: center;\n  }\n}<\/p>\n<p>\/* --- SCROLL REVEAL --- *\/\n.reveal {\n  opacity: 0;\n  transform: translateY(20px);\n  transition: opacity 0.6s ease, transform 0.6s ease;\n}<\/p>\n<p>.reveal.visible {\n  opacity: 1;\n  transform: translateY(0);\n}<\/p>\n<p>\/* --- LIGHTBOX --- *\/\n.lightbox {\n  position: fixed;\n  inset: 0;\n  background: rgba(0,0,0,0.9);\n  z-index: 1000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.3s ease;\n}<\/p>\n<p>.lightbox.active {\n  opacity: 1;\n  pointer-events: all;\n}<\/p>\n<p>.lightbox img {\n  max-width: 90vw;\n  max-height: 85vh;\n  object-fit: contain;\n  border-radius: var(--radius-lg);\n}<\/p>\n<p>.lightbox__close {\n  position: absolute;\n  top: var(--space-6);\n  right: var(--space-6);\n  width: 44px;\n  height: 44px;\n  border-radius: 50%;\n  background: rgba(255,255,255,0.15);\n  color: #fff;\n  font-size: 24px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  border: none;\n}<\/p>\n<p>.lightbox__close:hover {\n  background: rgba(255,255,255,0.25);\n}<\/p>\n<p>\/* --- GALLERY MODAL --- *\/\n.gallery-modal {\n  position: fixed;\n  inset: 0;\n  background: rgba(0,0,0,0.95);\n  z-index: 1000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.3s ease;\n}<\/p>\n<p>.gallery-modal.active {\n  opacity: 1;\n  pointer-events: all;\n}<\/p>\n<p>.gallery-modal__inner {\n  position: relative;\n  max-width: 90vw;\n  max-height: 85vh;\n}<\/p>\n<p>.gallery-modal__inner img {\n  max-width: 90vw;\n  max-height: 85vh;\n  object-fit: contain;\n  border-radius: var(--radius-md);\n}<\/p>\n<p>.gallery-modal__close {\n  position: absolute;\n  top: -40px;\n  right: 0;\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  background: rgba(255,255,255,0.15);\n  color: #fff;\n  font-size: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  border: none;\n}<\/p>\n<p>.gallery-modal__nav {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 44px;\n  height: 44px;\n  border-radius: 50%;\n  background: rgba(255,255,255,0.15);\n  color: #fff;\n  font-size: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  border: none;\n}<\/p>\n<p>.gallery-modal__nav:hover {\n  background: rgba(255,255,255,0.3);\n}<\/p>\n<p>.gallery-modal__nav--prev { left: -60px; }\n.gallery-modal__nav--next { right: -60px; }<\/p>\n<p>@media (max-width: 768px) {\n  .gallery-modal__nav--prev { left: var(--space-2); }\n  .gallery-modal__nav--next { right: var(--space-2); }\n}<\/p>\n<\/style>\n<p><!-- JSON-LD --><br \/>\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"LodgingBusiness\",\n  \"name\": \"A Pilgrim's Rest Guesthouse\",\n  \"description\": \"A charming heritage guesthouse in Graskop on the Panorama Route, Mpumalanga.\",\n  \"telephone\": \"+27 82 304 7157\",\n  \"address\": {\n    \"@type\": \"PostalAddress\",\n    \"addressLocality\": \"Graskop\",\n    \"addressRegion\": \"Mpumalanga\",\n    \"addressCountry\": \"ZA\"\n  },\n  \"url\": \"https:\/\/www.apilgrimsrestguesthouse.co.za\/\",\n  \"creator\": {\n    \"@type\": \"SoftwareApplication\",\n    \"name\": \"Perplexity Computer\",\n    \"url\": \"https:\/\/www.perplexity.ai\/computer\"\n  }\n}\n<\/script><br \/>\n<\/head><br \/>\n<body><\/p>\n<p><!-- ===== HEADER ===== --><\/p>\n<header class=\"header\" id=\"header\">\n<div class=\"header__inner\">\n    <a href=\"#\" class=\"header__logo\"><br \/>\n      <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/logo.jpg\" alt=\"A Pilgrim's Rest Guesthouse logo\"><\/p>\n<div class=\"header__logo-text\">\n        A Pilgrim&#8217;s Rest<br \/>\n        <span>Guesthouse<\/span>\n      <\/div>\n<p>    <\/a><\/p>\n<div class=\"nav-toggle\" id=\"navToggle\" aria-label=\"Toggle navigation\">\n      <span><\/span><span><\/span><span><\/span>\n    <\/div>\n<nav class=\"nav\" id=\"navMenu\">\n      <a href=\"#home\" class=\"nav__link\">Home<\/a><br \/>\n      <a href=\"#rooms\" class=\"nav__link\">Rooms<\/a><br \/>\n      <a href=\"#dining\" class=\"nav__link\">Dining<\/a><br \/>\n      <a href=\"#attractions\" class=\"nav__link\">Attractions<\/a><br \/>\n      <a href=\"#history\" class=\"nav__link\">History<\/a><br \/>\n      <a href=\"#contact\" class=\"nav__link\">Contact<\/a><br \/>\n      <button class=\"theme-toggle\" data-theme-toggle aria-label=\"Toggle dark mode\"><br \/>\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\"\/><\/svg><br \/>\n      <\/button><br \/>\n      <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"nav__link nav__link--cta\">Book Now<\/a><br \/>\n    <\/nav>\n<\/p><\/div>\n<\/header>\n<p><!-- ===== HERO ===== --><\/p>\n<section class=\"hero\" id=\"home\">\n<div class=\"hero__bg\">\n    <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/hero.jpg\" alt=\"A Pilgrim's Rest Guesthouse \u2014 beautiful Victorian gabled building in Graskop, Mpumalanga\" loading=\"eager\">\n  <\/div>\n<div class=\"hero__overlay\"><\/div>\n<div class=\"hero__content\">\n<div class=\"hero__badge\">Graskop, Mpumalanga &middot; Panorama Route<\/div>\n<h1 class=\"hero__title\">A Pilgrim&#8217;s Rest<br \/>Guesthouse<\/h1>\n<p class=\"hero__subtitle\">Please make yourself at home&#8230;<\/p>\n<div class=\"hero__actions\">\n      <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn btn--accent\">Book on Booking.com<\/a>\n    <\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== WELCOME ===== --><\/p>\n<section id=\"welcome\">\n<div class=\"container\">\n<div class=\"welcome reveal\">\n<div class=\"welcome__text\">\n<div class=\"section-header__badge\">Welcome<\/div>\n<h2>Your Home Away From Home<\/h2>\n<div class=\"divider-line\" style=\"margin-left:0\"><\/div>\n<p>Welcome to A Pilgrim&#8217;s Rest Guesthouse. Please make yourself at home, and feel free to use the lounge area, bar area and back garden at any time. Your room key also gives you access to the front door of the house as well as a remote for the gate and a key for the manual gate.<\/p>\n<p>Our hosts or one of our team members are available at all times on <a href=\"tel:+27823047157\">+27 82 304 7157<\/a> (phone\/WhatsApp). Maps and information about the area are available at reception.<\/p>\n<div class=\"welcome__features\">\n<div class=\"feature-card\">\n<div class=\"feature-card__icon\">&#127863;<\/div>\n<div class=\"feature-card__title\">Honesty Bar<\/div>\n<div class=\"feature-card__desc\">Help yourself to drinks from the bar fridge and settle the bill at checkout.<\/div>\n<\/p><\/div>\n<div class=\"feature-card\">\n<div class=\"feature-card__icon\">&#128250;<\/div>\n<div class=\"feature-card__title\">TV &amp; Movies<\/div>\n<div class=\"feature-card__desc\">Upstairs lounge with OpenView channels. USB stick with movies in your room.<\/div>\n<\/p><\/div>\n<div class=\"feature-card\">\n<div class=\"feature-card__icon\">&#128246;<\/div>\n<div class=\"feature-card__title\">Free Wi-Fi<\/div>\n<div class=\"feature-card__desc\">Complimentary Wi-Fi throughout the guesthouse. Code at reception.<\/div>\n<\/p><\/div>\n<div class=\"feature-card\">\n<div class=\"feature-card__icon\">&#127795;<\/div>\n<div class=\"feature-card__title\">Garden &amp; Patio<\/div>\n<div class=\"feature-card__desc\">Relax in our lush garden with fountain, gazebo, and outdoor seating.<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"welcome__gallery\">\n        <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/commonarea_pic2.jpg\" alt=\"Victorian lounge with antique furniture, ceiling fan, and chandelier\" loading=\"lazy\"><br \/>\n        <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/commonarea_pic1.jpg\" alt=\"Honesty bar with brass fittings and wooden bar stools\" loading=\"lazy\"><br \/>\n        <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/outside_pic1.jpg\" alt=\"Lush garden with fountain, gazebo, and tropical plants\" loading=\"lazy\">\n      <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== ROOMS & RATES ===== --><\/p>\n<section id=\"rooms\" class=\"section--alt\">\n<div class=\"container\">\n<div class=\"section-header reveal\">\n<div class=\"section-header__badge\">Accommodation<\/div>\n<h2 class=\"section-header__title\">Rooms &amp; Rates<\/h2>\n<div class=\"divider-line\"><\/div>\n<p class=\"section-header__desc\">Discover our beautifully appointed rooms, each with its own character. Victorian charm meets modern comfort.<\/p>\n<\/p><\/div>\n<div class=\"rooms-grid\">\n<p>      <!-- Gold Room --><\/p>\n<div class=\"room-card reveal\" data-room=\"gold\">\n<div class=\"room-card__gallery\">\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/goldroom_pic1.jpg\" alt=\"Gold Room \u2014 brass bed with canopy and gold accents\" class=\"active\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/goldroom_pic2.jpg\" alt=\"Gold Room \u2014 seating area with vintage chair\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/goldroom_pic3.jpg\" alt=\"Gold Room \u2014 Victorian bathroom with clawfoot tub\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/goldroom_pic4.jpg\" alt=\"Gold Room \u2014 ornate copper shower and basin\" loading=\"lazy\"><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--prev\" aria-label=\"Previous photo\">&#10094;<\/button><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--next\" aria-label=\"Next photo\">&#10095;<\/button><\/p>\n<div class=\"room-card__dots\">\n            <button class=\"room-card__dot active\" aria-label=\"Photo 1\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 2\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 3\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 4\"><\/button>\n          <\/div>\n<\/p><\/div>\n<div class=\"room-card__body\">\n<h3 class=\"room-card__name\">The Gold Room<\/h3>\n<p class=\"room-card__desc\">Warm and luxurious accommodation with cream and gold accents, a brass canopy bed, and a stunning Victorian bathroom with clawfoot tub and ornate copper shower.<\/p>\n<p>          <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"room-card__link\"><br \/>\n            View Details &amp; Book<br \/>\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><br \/>\n          <\/a>\n        <\/div>\n<\/p><\/div>\n<p>      <!-- Family Room --><\/p>\n<div class=\"room-card reveal\" data-room=\"family\">\n<div class=\"room-card__gallery\">\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/familyroom_pic1.jpg\" alt=\"Family Room \u2014 four-poster bed with floral curtains\" class=\"active\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/familyroom_pic2.jpg\" alt=\"Family Room \u2014 vanity with gilt mirror and armchair\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/familyroom_pic3.jpg\" alt=\"Family Room \u2014 cosy single bed alcove\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/familyroom_pic4.jpg\" alt=\"Family Room \u2014 wide view with multiple bed areas\" loading=\"lazy\"><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--prev\" aria-label=\"Previous photo\">&#10094;<\/button><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--next\" aria-label=\"Next photo\">&#10095;<\/button><\/p>\n<div class=\"room-card__dots\">\n            <button class=\"room-card__dot active\" aria-label=\"Photo 1\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 2\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 3\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 4\"><\/button>\n          <\/div>\n<\/p><\/div>\n<div class=\"room-card__body\">\n<h3 class=\"room-card__name\">The Family Room<\/h3>\n<p class=\"room-card__desc\">Spacious accommodation perfect for families, featuring a four-poster bed, additional single beds in private alcoves, floral wallpaper, and period furniture throughout.<\/p>\n<p>          <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"room-card__link\"><br \/>\n            View Details &amp; Book<br \/>\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><br \/>\n          <\/a>\n        <\/div>\n<\/p><\/div>\n<p>      <!-- Twin Room --><\/p>\n<div class=\"room-card reveal\" data-room=\"twin\">\n<div class=\"room-card__gallery\">\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/twinroom_pic1.jpg\" alt=\"Twin Room \u2014 two beds with pine ceiling and Victorian chandelier\" class=\"active\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/twinroom_pic2.jpg\" alt=\"Twin Room \u2014 close view of beds with rattan furniture and en-suite\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/twinroom_pic3.jpg\" alt=\"Twin Room \u2014 tea station with kettle and framed artwork\" loading=\"lazy\"><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--prev\" aria-label=\"Previous photo\">&#10094;<\/button><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--next\" aria-label=\"Next photo\">&#10095;<\/button><\/p>\n<div class=\"room-card__dots\">\n            <button class=\"room-card__dot active\" aria-label=\"Photo 1\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 2\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 3\"><\/button>\n          <\/div>\n<\/p><\/div>\n<div class=\"room-card__body\">\n<h3 class=\"room-card__name\">The Twin Room<\/h3>\n<p class=\"room-card__desc\">A charming attic-style room with two separate beds beneath a warm pine-panel ceiling with a brass chandelier. Ideal for friends or colleagues travelling together. Includes floral rattan seating, a full-length mirror, en-suite bathroom, air conditioning, and a complimentary tea &amp; coffee station.<\/p>\n<p>          <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"room-card__link\"><br \/>\n            View Details &amp; Book<br \/>\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><br \/>\n          <\/a>\n        <\/div>\n<\/p><\/div>\n<p>      <!-- Deluxe Double: Green --><\/p>\n<div class=\"room-card reveal\" data-room=\"green\">\n<div class=\"room-card__gallery\">\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/Greenroom_pic1.jpg\" alt=\"Deluxe Green Room \u2014 brass bed with blue-green accents\" class=\"active\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/greenroom_pic2.jpg\" alt=\"Deluxe Green Room \u2014 sitting area with loveseat\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/greenroom_pic3.jpg\" alt=\"Deluxe Green Room \u2014 en-suite with shower\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/greenroom_pic4.jpg\" alt=\"Deluxe Green Room \u2014 bathroom with basin and mirror\" loading=\"lazy\"><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--prev\" aria-label=\"Previous photo\">&#10094;<\/button><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--next\" aria-label=\"Next photo\">&#10095;<\/button><\/p>\n<div class=\"room-card__dots\">\n            <button class=\"room-card__dot active\" aria-label=\"Photo 1\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 2\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 3\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 4\"><\/button>\n          <\/div>\n<\/p><\/div>\n<div class=\"room-card__body\">\n<h3 class=\"room-card__name\">Deluxe Double &mdash; Green<\/h3>\n<p class=\"room-card__desc\">Serene forest green accents and spa-like amenities. Features a brass bed, floral wallpaper, ceiling fan, and a generous en-suite bathroom with period fixtures.<\/p>\n<p>          <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"room-card__link\"><br \/>\n            View Details &amp; Book<br \/>\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><br \/>\n          <\/a>\n        <\/div>\n<\/p><\/div>\n<p>      <!-- Deluxe Double: Red --><\/p>\n<div class=\"room-card reveal\" data-room=\"red\">\n<div class=\"room-card__gallery\">\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/redroom_pic1.jpg\" alt=\"Deluxe Red Room \u2014 white iron bed with burgundy accents\" class=\"active\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/redroom_pic2.jpg\" alt=\"Deluxe Red Room \u2014 wardrobe and bathroom entrance\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/redroom_pic3.jpg\" alt=\"Deluxe Red Room \u2014 sitting area with lamp and clock\" loading=\"lazy\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/redroom_pic4.jpg\" alt=\"Deluxe Red Room \u2014 pink bathroom with period basin\" loading=\"lazy\"><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--prev\" aria-label=\"Previous photo\">&#10094;<\/button><br \/>\n          <button class=\"room-card__gallery-nav room-card__gallery-nav--next\" aria-label=\"Next photo\">&#10095;<\/button><\/p>\n<div class=\"room-card__dots\">\n            <button class=\"room-card__dot active\" aria-label=\"Photo 1\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 2\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 3\"><\/button><br \/>\n            <button class=\"room-card__dot\" aria-label=\"Photo 4\"><\/button>\n          <\/div>\n<\/p><\/div>\n<div class=\"room-card__body\">\n<h3 class=\"room-card__name\">Deluxe Double &mdash; Red<\/h3>\n<p class=\"room-card__desc\">Premium elegance with warm burgundy and pink accents, damask wallpaper, a white wrought-iron bed, and an intimate en-suite bathroom with Victorian fixtures.<\/p>\n<p>          <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"room-card__link\"><br \/>\n            View Details &amp; Book<br \/>\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><br \/>\n          <\/a>\n        <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== BREAKFAST & DINING ===== --><\/p>\n<section id=\"dining\">\n<div class=\"container\">\n<div class=\"section-header reveal\">\n<div class=\"section-header__badge\">Dining<\/div>\n<h2 class=\"section-header__title\">Breakfast &amp; Dining<\/h2>\n<div class=\"divider-line\"><\/div>\n<\/p><\/div>\n<div class=\"dining-grid reveal\">\n<div class=\"dining-info\">\n<h3>Breakfast<\/h3>\n<div class=\"dining-detail\">\n<div class=\"dining-detail__icon\">&#9749;<\/div>\n<div class=\"dining-detail__text\">\n            <strong>7:30am &ndash; 9:30am &middot; R200 per person<\/strong><br \/>\n            <span>Please let your host know by 7pm the night before via WhatsApp or the Booking.com app so staff can be ready in time.<\/span>\n          <\/div>\n<\/p><\/div>\n<h3>Dinner<\/h3>\n<div class=\"dining-detail\">\n<div class=\"dining-detail__icon\">&#127860;<\/div>\n<div class=\"dining-detail__text\">\n            <strong>R350 per person &middot; Minimum 4 guests<\/strong><br \/>\n            <span>A full three-course dinner. Check at reception if dinner will be served during your stay. Starters, main course, and traditional South African desserts.<\/span>\n          <\/div>\n<\/p><\/div>\n<h3>Picnic Basket<\/h3>\n<div class=\"dining-detail\">\n<div class=\"dining-detail__icon\">&#127794;<\/div>\n<div class=\"dining-detail__text\">\n            <strong>Perfect for a day exploring<\/strong><br \/>\n            <span>Ciabatta, croissant, or wraps filled with ham, cheese, lettuce &amp; tomato. Includes fresh fruit and drinks from the bar packed in a cooler box.<\/span>\n          <\/div>\n<\/p><\/div>\n<div class=\"menu-images\" style=\"margin-top: var(--space-6);\">\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/dinner_menu.jpg\" alt=\"Dinner menu \u2014 three course meal including starters, mains, and dessert\" loading=\"lazy\" style=\"cursor:pointer\" onclick=\"openLightbox(this.src)\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/picnic_menu.jpg\" alt=\"Picnic basket menu \u2014 sandwiches, wraps, fruit, and drinks\" loading=\"lazy\" style=\"cursor:pointer\" onclick=\"openLightbox(this.src)\">\n        <\/div>\n<\/p><\/div>\n<div class=\"restaurants\">\n<h3>Restaurants in Town<\/h3>\n<p style=\"color:var(--color-text-muted); font-size:var(--text-sm); margin-bottom:var(--space-4);\">All within walking distance of the guesthouse.<\/p>\n<div class=\"restaurant-card\">\n<div>\n<div class=\"restaurant-card__name\">Harrie&#8217;s Pancakes<\/div>\n<div class=\"restaurant-card__details\">\n              Cnr Louis Trichardt &amp; Church Street (150m away)<br \/>\n              Hours: 8am &ndash; 6pm<br \/>\n              <a href=\"tel:+27137671273\" style=\"color:var(--color-primary)\">+27 13 767 1273<\/a>\n            <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"restaurant-card\">\n<div>\n<div class=\"restaurant-card__name\">The Glass House<\/div>\n<div class=\"restaurant-card__details\">\n              Louis Trichardt Ave (150m away)<br \/>\n              Hours: 5:30pm &ndash; 9pm &middot; Bookings essential<br \/>\n              <a href=\"tel:+27826046598\" style=\"color:var(--color-primary)\">+27 82 604 6598<\/a>\n            <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"restaurant-card\">\n<div>\n<div class=\"restaurant-card__name\">The Garden Shed<\/div>\n<div class=\"restaurant-card__details\">\n              Louis Trichardt Ave (300m away)<br \/>\n              Hours: 8am &ndash; 10pm<br \/>\n              <a href=\"tel:+27736689074\" style=\"color:var(--color-primary)\">+27 73 668 9074<\/a>\n            <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"restaurant-card\">\n<div>\n<div class=\"restaurant-card__name\">Canto&#8217;s Italian Restaurant<\/div>\n<div class=\"restaurant-card__details\">\n              Main Street (500m away)<br \/>\n              Hours: 10am &ndash; 8:30pm<br \/>\n              Also: Oden&#8217;s Table Pub (behind Canto&#8217;s, open till late)\n            <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== AREA & ATTRACTIONS ===== --><\/p>\n<section id=\"attractions\" class=\"section--alt\">\n<div class=\"container\">\n<div class=\"section-header reveal\">\n<div class=\"section-header__badge\">Explore<\/div>\n<h2 class=\"section-header__title\">Area &amp; Attractions<\/h2>\n<div class=\"divider-line\"><\/div>\n<\/p><\/div>\n<div class=\"attractions-intro reveal\">\n<p>Graskop is a small town in Mpumalanga that never fails to astound with its natural beauty. It forms the gateway to the Panorama Route, known for the Blyde River Canyon (the largest green canyon in the world), Bourke&#8217;s Luck Potholes, God&#8217;s Window, Three Rondavels, and an abundance of cascading waterfalls. Our guesthouse is perfectly positioned as your base for exploring.<\/p>\n<\/p><\/div>\n<div class=\"attractions-grid reveal\">\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Graskop Gorge Lift<\/div>\n<div class=\"attraction-card__distance\">2 km<\/div>\n<div class=\"attraction-card__desc\">Scenic cable car descent into the forested gorge with walkways among the trees.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">God&#8217;s Window<\/div>\n<div class=\"attraction-card__distance\">9 km<\/div>\n<div class=\"attraction-card__desc\">One of the most spectacular viewpoints on the Panorama Route with views over the Lowveld.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Lisbon Falls<\/div>\n<div class=\"attraction-card__distance\">8.8 km<\/div>\n<div class=\"attraction-card__desc\">Beautiful waterfall cascading into a deep pool surrounded by lush vegetation.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Berlin Falls<\/div>\n<div class=\"attraction-card__distance\">11 km<\/div>\n<div class=\"attraction-card__desc\">Impressive 45m waterfall plunging into a clear pool, perfect for photography.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Mac Mac Falls<\/div>\n<div class=\"attraction-card__distance\">16 km<\/div>\n<div class=\"attraction-card__desc\">Beautiful twin waterfall perfect for nature walks and photography.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Mac Mac Pools<\/div>\n<div class=\"attraction-card__distance\">17 km<\/div>\n<div class=\"attraction-card__desc\">Natural swimming pools along the Mac Mac River, ideal for a refreshing dip.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Pilgrim&#8217;s Rest<\/div>\n<div class=\"attraction-card__distance\">16 km<\/div>\n<div class=\"attraction-card__desc\">Historic gold mining town offering insight into South Africa&#8217;s gold rush era.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Bourke&#8217;s Luck Potholes<\/div>\n<div class=\"attraction-card__distance\">36 km<\/div>\n<div class=\"attraction-card__desc\">Spectacular geological formations at the confluence of two rivers.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Three Rondavels<\/div>\n<div class=\"attraction-card__distance\">52 km<\/div>\n<div class=\"attraction-card__desc\">Iconic rock formations that define the Panorama Route landscape.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Blyde River Canyon<\/div>\n<div class=\"attraction-card__distance\">97 km<\/div>\n<div class=\"attraction-card__desc\">The world&#8217;s largest green canyon with breathtaking views and diverse ecosystems.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Sabie Falls<\/div>\n<div class=\"attraction-card__distance\">30 km<\/div>\n<div class=\"attraction-card__desc\">A series of waterfalls near the forestry town of Sabie.<\/div>\n<\/p><\/div>\n<div class=\"attraction-card\">\n<div class=\"attraction-card__name\">Forest Falls &amp; More<\/div>\n<div class=\"attraction-card__distance\">35&ndash;39 km<\/div>\n<div class=\"attraction-card__desc\">Bridal Veil Falls, Horse Shoe Falls, Lone Creek Falls &mdash; all within easy reach.<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>    <!-- Kruger National Park --><\/p>\n<div class=\"kruger-section reveal\">\n<h3>Kruger National Park<\/h3>\n<p style=\"color: rgba(250,248,243,0.8); margin-bottom: var(--space-6);\">Multiple entry gates within driving distance. Plan your safari from the comfort of our guesthouse.<\/p>\n<div class=\"kruger-gates\">\n<div class=\"kruger-gate\"><strong>Phabeni Gate<\/strong> 42 km<\/div>\n<div class=\"kruger-gate\"><strong>Numbi Gate<\/strong> 44 km<\/div>\n<div class=\"kruger-gate\"><strong>Orpen Gate<\/strong> 44 km<\/div>\n<div class=\"kruger-gate\"><strong>Paul Kruger Gate<\/strong> 65 km<\/div>\n<div class=\"kruger-gate\"><strong>Malelane Gate<\/strong> 94 km<\/div>\n<div class=\"kruger-gate\"><strong>Phalaborwa Gate<\/strong> 114 km<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>    <!-- Google Map --><\/p>\n<div class=\"reveal\" style=\"margin-top: var(--space-8);\">\n<h3 style=\"font-family:var(--font-display); font-size:var(--text-lg); margin-bottom:var(--space-4); text-align:center;\">Find Us<\/h3>\n<div class=\"map-container\">\n        <iframe\n          src=\"https:\/\/maps.google.com\/maps?q=A+Pilgrims+Rest+Guesthouse,+8+Louis+Trichardt+Street,+Graskop,+Mpumalanga,+South+Africa&#038;z=16&#038;output=embed\"\n          allowfullscreen=\"\"\n          loading=\"lazy\"\n          referrerpolicy=\"no-referrer-when-downgrade\"\n          title=\"A Pilgrim's Rest Guesthouse location on Google Maps\"\n          style=\"border:0;\"\n        ><\/iframe>\n      <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== HISTORY ===== --><\/p>\n<section id=\"history\">\n<div class=\"container\">\n<div class=\"history-content reveal\">\n<div class=\"history-text\">\n<div class=\"section-header__badge\">Heritage<\/div>\n<h2>The History of Graskop<\/h2>\n<div class=\"divider-line\" style=\"margin-left:0\"><\/div>\n<p>The picturesque town of Graskop, nestled in the heart of Mpumalanga&#8217;s Panorama Route, carries with it a rich tapestry of history that reflects the broader narrative of South Africa&#8217;s past.<\/p>\n<p>Emerging as a settlement during the gold rush era of the late 19th century, Graskop became a thriving hub for prospectors and entrepreneurs seeking their fortune in the mineral-rich hills of the Eastern Transvaal.<\/p>\n<p>The town&#8217;s name, derived from the Afrikaans <em>gras<\/em> (grass) and <em>kop<\/em> (head), refers to the grasslands that covered the surrounding hills. As mining operations expanded and the railway line was extended through the region, Graskop evolved from a frontier settlement into an established community.<\/p>\n<p>Nearby Pilgrim&#8217;s Rest, one of South Africa&#8217;s best-preserved gold rush towns, stands as a testament to this remarkable era &mdash; and our guesthouse proudly carries this heritage in its name.<\/p>\n<\/p><\/div>\n<div class=\"history-image\">\n        <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/commonarea_pic3.jpg\" alt=\"Victorian spiral staircase and period decor inside the guesthouse\" loading=\"lazy\">\n      <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== CONTACT ===== --><\/p>\n<section id=\"contact\" class=\"section--alt\">\n<div class=\"container\">\n<div class=\"section-header reveal\">\n<div class=\"section-header__badge\">Get in Touch<\/div>\n<h2 class=\"section-header__title\">Contact Us<\/h2>\n<div class=\"divider-line\"><\/div>\n<\/p><\/div>\n<div class=\"contact-grid reveal\">\n<div class=\"contact-info\">\n<h3>Contact Information<\/h3>\n<div class=\"contact-item\">\n<div class=\"contact-item__icon\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg>\n          <\/div>\n<div class=\"contact-item__text\">\n            <strong>Phone \/ WhatsApp<\/strong><br \/>\n            <a href=\"tel:+27823047157\">+27 82 304 7157<\/a>\n          <\/div>\n<\/p><\/div>\n<div class=\"contact-item\">\n<div class=\"contact-item__icon\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"\/><circle cx=\"12\" cy=\"10\" r=\"3\"\/><\/svg>\n          <\/div>\n<div class=\"contact-item__text\">\n            <strong>Location<\/strong><br \/>\n            <span>Graskop, Mpumalanga, South Africa<\/span>\n          <\/div>\n<\/p><\/div>\n<div class=\"contact-item\">\n<div class=\"contact-item__icon\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"\/><\/svg>\n          <\/div>\n<div class=\"contact-item__text\">\n            <strong>Website<\/strong><br \/>\n            <a href=\"https:\/\/www.apilgrimsrestguesthouse.co.za\/\" target=\"_blank\" rel=\"noopener noreferrer\">www.apilgrimsrestguesthouse.co.za<\/a>\n          <\/div>\n<\/p><\/div>\n<div style=\"margin-top:var(--space-6)\">\n<h3>Host<\/h3>\n<p style=\"color:var(--color-text-muted); font-size:var(--text-sm); margin-top:var(--space-2);\">Adele Jooste<br \/>A Pilgrim&#8217;s Rest Guesthouse<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"emergency-card\">\n<h3>\n          <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M12 9v4M12 17h.01M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\"\/><\/svg><br \/>\n          Emergency Contacts<br \/>\n        <\/h3>\n<div class=\"emergency-item\">\n          <span class=\"emergency-item__name\">Local Doctor (100m away)<\/span><br \/>\n          <span class=\"emergency-item__number\"><a href=\"tel:+27725276629\">Dr Zelda Mkhonto<\/a><\/span>\n        <\/div>\n<div class=\"emergency-item\">\n          <span class=\"emergency-item__name\">Doctor Emergency<\/span><br \/>\n          <span class=\"emergency-item__number\"><a href=\"tel:+27725276629\">072 527 6629<\/a><\/span>\n        <\/div>\n<div class=\"emergency-item\">\n          <span class=\"emergency-item__name\">Police<\/span><br \/>\n          <span class=\"emergency-item__number\"><a href=\"tel:0137671122\">013 767 1122<\/a><\/span>\n        <\/div>\n<div class=\"emergency-item\">\n          <span class=\"emergency-item__name\">Ambulance<\/span><br \/>\n          <span class=\"emergency-item__number\"><a href=\"tel:10177\">10177<\/a><\/span>\n        <\/div>\n<div class=\"emergency-item\">\n          <span class=\"emergency-item__name\">Hospital (Sabie)<\/span><br \/>\n          <span class=\"emergency-item__number\"><a href=\"tel:0137641222\">013 764 1222<\/a><\/span>\n        <\/div>\n<div class=\"emergency-item\">\n          <span class=\"emergency-item__name\">Fire Brigade<\/span><br \/>\n          <span class=\"emergency-item__number\"><a href=\"tel:0137671211\">013 767 1211<\/a><\/span>\n        <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>    <!-- Booking CTA --><\/p>\n<div class=\"booking-cta reveal\">\n<h3>Ready to Book?<\/h3>\n<p>Reserve your stay at A Pilgrim&#8217;s Rest Guesthouse easily and securely via Booking.com.<\/p>\n<div class=\"booking-cta__buttons\">\n        <a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn btn--white\">Book on Booking.com<\/a><br \/>\n        <a href=\"tel:+27823047157\" class=\"btn btn--outline-white\">Call Us Directly<\/a>\n      <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- ===== FOOTER ===== --><\/p>\n<footer class=\"footer\">\n<div class=\"container\">\n<div class=\"footer__inner\">\n<div class=\"footer__brand\">\n        <a href=\"#\" class=\"header__logo\" style=\"margin-bottom:var(--space-2)\"><br \/>\n          <img decoding=\"async\" src=\"https:\/\/apilgrimsrestguesthouse.com\/wp-content\/uploads\/2026\/03\/logo.jpg\" alt=\"Logo\" style=\"height:36px\"><\/p>\n<div class=\"header__logo-text\" style=\"font-size:var(--text-base)\">\n            A Pilgrim&#8217;s Rest<br \/>\n            <span>Guesthouse<\/span>\n          <\/div>\n<p>        <\/a><\/p>\n<p>Your home away from home on the Panorama Route. Heritage charm meets modern comfort in Graskop, Mpumalanga.<\/p>\n<\/p><\/div>\n<div>\n<h4>Quick Links<\/h4>\n<ul class=\"footer__links\">\n<li><a href=\"#home\">Home<\/a><\/li>\n<li><a href=\"#rooms\">Rooms &amp; Rates<\/a><\/li>\n<li><a href=\"#dining\">Breakfast &amp; Dining<\/a><\/li>\n<li><a href=\"#attractions\">Area &amp; Attractions<\/a><\/li>\n<li><a href=\"#history\">History<\/a><\/li>\n<li><a href=\"#contact\">Contact<\/a><\/li>\n<\/ul><\/div>\n<div>\n<h4>Book Your Stay<\/h4>\n<ul class=\"footer__links\">\n<li><a href=\"https:\/\/www.booking.com\/hotel\/za\/a-pilgrims-rest.html\" target=\"_blank\" rel=\"noopener noreferrer\">Booking.com<\/a><\/li>\n<li><a href=\"tel:+27823047157\">+27 82 304 7157<\/a><\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<div class=\"footer__bottom\">\n      <span>&copy; 2026 A Pilgrim&#8217;s Rest Guesthouse. All rights reserved.<\/span><br \/>\n      <a href=\"https:\/\/www.apilgrimsrestguesthouse.co.za\" target=\"_blank\" rel=\"noopener noreferrer\">apilgrimsrestguesthouse.co.za<\/a>\n    <\/div>\n<\/p><\/div>\n<\/footer>\n<p><!-- Lightbox for menu images --><\/p>\n<div class=\"lightbox\" id=\"lightbox\">\n  <button class=\"lightbox__close\" onclick=\"closeLightbox()\">&times;<\/button><br \/>\n  <img decoding=\"async\" src=\"\" alt=\"Full size menu image\" id=\"lightboxImg\">\n<\/div>\n<p><script>\n\/\/ Dark mode toggle\n(function(){\n  const t = document.querySelector('[data-theme-toggle]');\n  const r = document.documentElement;\n  let d = matchMedia('(prefers-color-scheme:dark)').matches ? 'dark' : 'light';\n  r.setAttribute('data-theme', d);<\/p>\n<p>  function updateIcon() {\n    if (!t) return;\n    t.innerHTML = d === 'dark' \n      ? '<svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"5\"\/><path d=\"M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42\"\/><\/svg>'\n      : '<svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\"\/><\/svg>';\n  }<\/p>\n<p>  updateIcon();\n  t && t.addEventListener('click', () => {\n    d = d === 'dark' ? 'light' : 'dark';\n    r.setAttribute('data-theme', d);\n    updateIcon();\n  });\n})();<\/p>\n<p>\/\/ Mobile nav\nconst navToggle = document.getElementById('navToggle');\nconst navMenu = document.getElementById('navMenu');<\/p>\n<p>navToggle.addEventListener('click', () => {\n  navToggle.classList.toggle('active');\n  navMenu.classList.toggle('open');\n});<\/p>\n<p>\/\/ Close mobile nav on link click\nnavMenu.querySelectorAll('.nav__link').forEach(link => {\n  link.addEventListener('click', () => {\n    navToggle.classList.remove('active');\n    navMenu.classList.remove('open');\n  });\n});<\/p>\n<p>\/\/ Sticky header shadow\nconst header = document.getElementById('header');\nwindow.addEventListener('scroll', () => {\n  header.classList.toggle('header--scrolled', window.scrollY > 10);\n});<\/p>\n<p>\/\/ Room card galleries \u2014 with touch\/swipe support for mobile\ndocument.querySelectorAll('.room-card').forEach(card => {\n  const imgs = card.querySelectorAll('.room-card__gallery img');\n  const dots = card.querySelectorAll('.room-card__dot');\n  const prevBtn = card.querySelector('.room-card__gallery-nav--prev');\n  const nextBtn = card.querySelector('.room-card__gallery-nav--next');\n  const gallery = card.querySelector('.room-card__gallery');\n  let current = 0;\n  let touchStartX = 0;\n  let touchEndX = 0;<\/p>\n<p>  function showSlide(n) {\n    imgs.forEach(function(img) { img.classList.remove('active'); });\n    dots.forEach(function(dot) { dot.classList.remove('active'); });\n    current = (n + imgs.length) % imgs.length;\n    imgs[current].classList.add('active');\n    if (dots[current]) dots[current].classList.add('active');\n  }<\/p>\n<p>  if (prevBtn) prevBtn.addEventListener('click', function(e) { e.stopPropagation(); showSlide(current - 1); });\n  if (nextBtn) nextBtn.addEventListener('click', function(e) { e.stopPropagation(); showSlide(current + 1); });\n  dots.forEach(function(dot, i) { dot.addEventListener('click', function() { showSlide(i); }); });<\/p>\n<p>  \/\/ Touch swipe support\n  if (gallery) {\n    gallery.addEventListener('touchstart', function(e) {\n      touchStartX = e.changedTouches[0].screenX;\n    }, { passive: true });\n    gallery.addEventListener('touchend', function(e) {\n      touchEndX = e.changedTouches[0].screenX;\n      var diff = touchStartX - touchEndX;\n      if (Math.abs(diff) > 40) {\n        if (diff > 0) { showSlide(current + 1); } \/\/ swipe left = next\n        else { showSlide(current - 1); }           \/\/ swipe right = prev\n      }\n    }, { passive: true });\n  }\n});<\/p>\n<p>\/\/ Lightbox for menu images\nfunction openLightbox(src) {\n  const lb = document.getElementById('lightbox');\n  const img = document.getElementById('lightboxImg');\n  img.src = src;\n  lb.classList.add('active');\n}<\/p>\n<p>function closeLightbox() {\n  document.getElementById('lightbox').classList.remove('active');\n}<\/p>\n<p>document.getElementById('lightbox').addEventListener('click', (e) => {\n  if (e.target === e.currentTarget) closeLightbox();\n});<\/p>\n<p>document.addEventListener('keydown', (e) => {\n  if (e.key === 'Escape') closeLightbox();\n});<\/p>\n<p>\/\/ Scroll reveal\nconst observer = new IntersectionObserver((entries) => {\n  entries.forEach(entry => {\n    if (entry.isIntersecting) {\n      entry.target.classList.add('visible');\n    }\n  });\n}, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' });<\/p>\n<p>document.querySelectorAll('.reveal').forEach(el => observer.observe(el));\n<\/script><\/p>\n<p><\/body><br \/>\n<\/html><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A Pilgrim&#8217;s Rest Guesthouse | Graskop, Mpumalanga A Pilgrim&#8217;s Rest Guesthouse Home Rooms Dining Attractions History Contact Book Now Graskop, Mpumalanga &middot; Panorama Route A Pilgrim&#8217;s RestGuesthouse Please make yourself at home&#8230; Book on Booking.com Welcome Your Home Away From Home Welcome to A Pilgrim&#8217;s Rest Guesthouse. Please make yourself at home, and feel free [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-40","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=\/wp\/v2\/pages\/40","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=40"}],"version-history":[{"count":1,"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=\/wp\/v2\/pages\/40\/revisions"}],"predecessor-version":[{"id":44,"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=\/wp\/v2\/pages\/40\/revisions\/44"}],"wp:attachment":[{"href":"https:\/\/apilgrimsrestguesthouse.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=40"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}