diff --git a/astra-child-hoponhopoff.zip b/astra-child-hoponhopoff.zip
index aae21c1..f7c8114 100644
Binary files a/astra-child-hoponhopoff.zip and b/astra-child-hoponhopoff.zip differ
diff --git a/astra-child-hoponhopoff/assets/chrome.css b/astra-child-hoponhopoff/assets/chrome.css
index 078d88a..cca3522 100644
--- a/astra-child-hoponhopoff/assets/chrome.css
+++ b/astra-child-hoponhopoff/assets/chrome.css
@@ -421,6 +421,7 @@
 }
 
 .hoho .ring-badge--top .ring-badge__text {
+  fill: #808080;
   font-size: 0.625rem;
   letter-spacing: 0.02em;
 }
@@ -546,15 +547,26 @@
   box-shadow: 0 1.25rem 2.5rem rgba(0, 0, 0, 0.18);
   opacity: 0;
   visibility: hidden;
-  transform: translateY(-0.375rem);
-  transition: opacity 0.2s var(--ease), transform 0.2s var(--ease), visibility 0.2s;
+  transform: translateY(-0.4rem) scale(0.97);
+  transform-origin: top center;
+  /* Exit: fade/slide out, then flip visibility only once the fade is done, so
+     the close animates instead of snapping. */
+  transition:
+    opacity 0.16s var(--ease),
+    transform 0.16s var(--ease),
+    visibility 0s linear 0.16s;
 }
 
 .hoho .nav__item--has-menu:hover .nav__submenu,
 .hoho .nav__toggle[aria-expanded="true"]+.nav__submenu {
   opacity: 1;
   visibility: visible;
-  transform: translateY(0);
+  transform: translateY(0) scale(1);
+  /* Enter: a slightly longer, soft ease-out so it settles in gently. */
+  transition:
+    opacity 0.24s var(--ease),
+    transform 0.28s cubic-bezier(0.16, 1, 0.3, 1),
+    visibility 0s;
 }
 
 .hoho .nav__submenu a {
@@ -1868,14 +1880,24 @@
     box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.22);
     opacity: 0;
     visibility: hidden;
-    transform: translateY(-0.5rem);
-    transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s;
+    transform: translateY(-0.6rem) scale(0.98);
+    transform-origin: top right;
+    /* Exit: fade/slide up, then hide once the fade completes. */
+    transition:
+      opacity 0.18s var(--ease),
+      transform 0.18s var(--ease),
+      visibility 0s linear 0.18s;
   }
 
 .hoho .nav.is-open {
     opacity: 1;
     visibility: visible;
-    transform: translateY(0);
+    transform: translateY(0) scale(1);
+    /* Enter: soft ease-out settle. */
+    transition:
+      opacity 0.26s var(--ease),
+      transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
+      visibility 0s;
   }
 
 .hoho .nav__list {
diff --git a/astra-child-hoponhopoff/assets/sprite.svg b/astra-child-hoponhopoff/assets/sprite.svg
index 7ab87c7..cd72f4b 100644
--- a/astra-child-hoponhopoff/assets/sprite.svg
+++ b/astra-child-hoponhopoff/assets/sprite.svg
@@ -1,4 +1,4 @@
-  <svg class="sprite" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg">
+  <svg class="sprite" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" style="position:absolute;width:0;height:0;overflow:hidden">
     <defs>
       <path id="ringPathScroll" fill="none" d="M50,50 m-39,0 a39,39 0 1,1 78,0 a39,39 0 1,1 -78,0" />
     </defs>
diff --git a/astra-child-hoponhopoff/functions.php b/astra-child-hoponhopoff/functions.php
index 3137470..b0170f4 100644
--- a/astra-child-hoponhopoff/functions.php
+++ b/astra-child-hoponhopoff/functions.php
@@ -23,10 +23,10 @@ add_action( 'wp_enqueue_scripts', function () {
 	if ( wp_style_is( 'astra-theme-css', 'registered' ) ) {
 		$deps[] = 'astra-theme-css';
 	}
-	wp_enqueue_style( 'hoho-chrome', get_stylesheet_directory_uri() . '/assets/chrome.css', $deps, '1.0.2' );
+	wp_enqueue_style( 'hoho-chrome', get_stylesheet_directory_uri() . '/assets/chrome.css', $deps, '1.0.8' );
 
 	// Header interactions: burger, submenu, sticky, back-to-top, search toggle.
-	wp_enqueue_script( 'hoho-chrome', get_stylesheet_directory_uri() . '/assets/chrome.js', array(), '1.0.2', true );
+	wp_enqueue_script( 'hoho-chrome', get_stylesheet_directory_uri() . '/assets/chrome.js', array(), '1.0.8', true );
 
 	wp_add_inline_style(
 		'hoho-chrome',
@@ -40,9 +40,17 @@ add_action( 'wp_enqueue_scripts', function () {
 				'.hoho,.hoho h1,.hoho h2,.hoho h3,.hoho p,.hoho a,.hoho span,.hoho li,.hoho button,.hoho input{font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}',
 				// Normalize: stop Astra decorating header/footer links & lists.
 				'.hoho a,.hoho.hoho a{text-decoration:none!important;box-shadow:none!important;}',
-				'.hoho a:not(.btn){color:inherit;}',
+				// …but not ring-badges: they set their own colour on the <a>, and this
+				// inherit rule out-specifies .ring-badge--top, turning the footer
+				// "back to top" text white (inherited) on the light area above it.
+				'.hoho a:not(.btn):not(.ring-badge){color:inherit;}',
 				'.hoho :is(ul,ol){list-style:none!important;margin:0!important;padding:0!important;}',
 				'.hoho li{margin:0!important;}',
+				// Let the footer\'s decorative bits (back-to-top ring, support tab)
+				// spill vertically, but keep the horizontal axis clipped so nothing
+				// causes a mobile sideways scroll. overflow-x:clip (unlike hidden)
+				// does not force overflow-y to auto, so the y-axis stays visible.
+				'.hoho,.hoho .footer{overflow-x:clip;overflow-y:visible;}',
 				// Icon buttons: Astra gives <button> a filled background + its own
 				// colour, which turned the header search icon into an empty dark
 				// circle. Reset them (real .btn buttons keep their styling).
@@ -51,9 +59,11 @@ add_action( 'wp_enqueue_scripts', function () {
 				'.hoho button:not(.btn):not(.burger){background:transparent;border:0;color:inherit;}',
 				// Expanding header search field.
 				'.hoho .header__search{display:flex;align-items:center;gap:.25rem;}',
-				'.hoho .header__search-input{width:0;min-width:0;padding:0;border:0;outline:0;opacity:0;height:var(--control-h);border-radius:var(--r-pill);background:rgba(255,255,255,.15);color:#fff;transition:width .25s var(--ease),opacity .2s var(--ease),padding .25s var(--ease);}',
+				// !important beats Astra's input[type=search] styling, which forces a
+				// white field background (and, with a white placeholder, hid the text).
+				'.hoho .header__search-input{width:0;min-width:0;padding:0;border:0!important;outline:0;opacity:0;height:var(--control-h);border-radius:var(--r-pill)!important;background:rgba(255,255,255,.15)!important;color:#fff!important;box-shadow:none!important;transition:width .25s var(--ease),opacity .2s var(--ease),padding .25s var(--ease);}',
 				'.hoho .header__search.is-open .header__search-input{width:min(52vw,15rem);padding:0 1rem;opacity:1;}',
-				'.hoho .header__search-input::placeholder{color:rgba(255,255,255,.7);}',
+				'.hoho .header__search-input::placeholder{color:rgba(255,255,255,.7)!important;opacity:1;}',
 			)
 		)
 	);
@@ -105,9 +115,11 @@ add_action( 'wp', function () {
 	}
 	add_action( 'astra_header', 'hoho_render_header' );
 
-	if ( function_exists( 'astra_footer_markup' ) ) {
-		remove_action( 'astra_footer', 'astra_footer_markup' );
-	}
+	// Astra renders its footer via the Footer Builder (a class method on the
+	// `astra_footer` hook), so removing the legacy astra_footer_markup() alone
+	// left a second, default footer. Clear every callback on the hook, then add
+	// ours — a clean, full replacement regardless of classic vs builder footer.
+	remove_all_actions( 'astra_footer' );
 	add_action( 'astra_footer', 'hoho_render_footer' );
 } );
 
@@ -146,7 +158,10 @@ function hoho_logo() {
  * Small helper: inline-icon markup referencing the sprite.
  */
 function hoho_icon( $name, $extra = '' ) {
-	$name  = preg_replace( '/[^a-z0-9\-]/', '', 'i-' . ltrim( (string) $name, 'i-' ) );
+	// Strip an existing "i-" prefix (once), then re-add it. ltrim() with a
+	// charlist would eat any leading i/-, turning "instagram" into "nstagram".
+	$slug  = preg_replace( '/^i-/', '', (string) $name );
+	$name  = preg_replace( '/[^a-z0-9\-]/', '', 'i-' . $slug );
 	$class = 'icon' . ( $extra ? ' ' . $extra : '' );
 	return '<svg class="' . esc_attr( $class ) . '" aria-hidden="true"><use href="#' . esc_attr( $name ) . '"></use></svg>';
 }
diff --git a/astra-child-hoponhopoff/inc/footer.php b/astra-child-hoponhopoff/inc/footer.php
index d3ead3b..1a7c5ee 100644
--- a/astra-child-hoponhopoff/inc/footer.php
+++ b/astra-child-hoponhopoff/inc/footer.php
@@ -39,7 +39,10 @@ $hoho_footer_col = function ( $location ) {
 	<footer class="footer" id="footer">
 		<a class="ring-badge ring-badge--top" href="#top" aria-label="<?php echo esc_attr__( 'Back to top', 'hoponhopoff' ); ?>">
 			<svg class="ring-badge__ring" viewBox="0 0 100 100" aria-hidden="true">
-				<text class="ring-badge__text"><textPath href="#ringPathScroll" startOffset="0">BACK TO TOP · BACK TO TOP · </textPath></text>
+				<text class="ring-badge__text" text-anchor="middle">
+					<textPath href="#ringPathScroll" startOffset="25%"><?php echo esc_html__( 'BACK TO TOP', 'hoponhopoff' ); ?></textPath>
+					<textPath href="#ringPathScroll" startOffset="75%"><?php echo esc_html__( 'BACK TO TOP', 'hoponhopoff' ); ?></textPath>
+				</text>
 			</svg>
 			<span class="ring-badge__dot"><svg class="icon" aria-hidden="true"><use href="#i-arrow-up"></use></svg></span>
 		</a>
diff --git a/astra-child-hoponhopoff/style.css b/astra-child-hoponhopoff/style.css
index 6ebe981..65a1ab7 100644
--- a/astra-child-hoponhopoff/style.css
+++ b/astra-child-hoponhopoff/style.css
@@ -4,7 +4,7 @@ Theme URI: https://git.kaamyab.dev/vargha/TourWebsite
 Description: Astra child theme that replaces the Astra header and footer with the "Hop On Hop Off" design. Pairs with the Viator Collector plugin.
 Author: Amir Bagheri
 Template: astra
-Version: 1.0.2
+Version: 1.0.8
 Text Domain: hoponhopoff
 */
 
diff --git a/new front/css/style.css b/new front/css/style.css
index b7fbb1a..6e3f445 100644
--- a/new front/css/style.css	
+++ b/new front/css/style.css	
@@ -58,7 +58,15 @@ html {
 
 body {
   margin: 0;
-  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  font-family:
+    "Plus Jakarta Sans",
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    Helvetica,
+    Arial,
+    sans-serif;
   font-size: var(--fs-body);
   line-height: 1.5;
   color: var(--c-ink);
@@ -173,7 +181,10 @@ dd {
   border-radius: var(--r-pill);
   font-weight: 700;
   white-space: nowrap;
-  transition: transform 0.2s var(--ease), filter 0.2s var(--ease), background 0.2s var(--ease);
+  transition:
+    transform 0.2s var(--ease),
+    filter 0.2s var(--ease),
+    background 0.2s var(--ease);
 }
 
 .btn:hover {
@@ -378,7 +389,9 @@ dd {
 
 .rail:hover .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
 .rail:hover .acard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
-.bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot {
+.bus__grid:hover
+  .tcard.is-active:not(:hover):not(:focus-within)
+  .ring-badge__dot {
   color: var(--c-white);
   background: var(--c-glass);
 }
@@ -430,7 +443,6 @@ dd {
 }
 
 @keyframes nudge {
-
   0%,
   60%,
   100% {
@@ -541,11 +553,14 @@ dd {
   opacity: 0;
   visibility: hidden;
   transform: translateY(-0.375rem);
-  transition: opacity 0.2s var(--ease), transform 0.2s var(--ease), visibility 0.2s;
+  transition:
+    opacity 0.2s var(--ease),
+    transform 0.2s var(--ease),
+    visibility 0.2s;
 }
 
 .nav__item--has-menu:hover .nav__submenu,
-.nav__toggle[aria-expanded="true"]+.nav__submenu {
+.nav__toggle[aria-expanded="true"] + .nav__submenu {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
@@ -585,7 +600,9 @@ dd {
   height: 0.125rem;
   border-radius: 1px;
   background: var(--c-white);
-  transition: transform 0.25s var(--ease), opacity 0.25s var(--ease);
+  transition:
+    transform 0.25s var(--ease),
+    opacity 0.25s var(--ease);
 }
 
 .burger[aria-expanded="true"] span:nth-child(1) {
@@ -607,9 +624,9 @@ dd {
   position: relative;
   display: grid;
   align-items: end;
-  min-height: clamp(34rem, 88svh, 56rem);
   margin: var(--page-inset);
-  padding-block: calc(var(--header-h) + var(--sp-6)) clamp(3rem, 1.5rem + 6vw, 6rem);
+  padding-block: calc(var(--header-h) + var(--sp-6))
+    clamp(3rem, 1.5rem + 6vw, 6rem);
   border-radius: var(--r-xl);
   isolation: isolate;
 }
@@ -634,7 +651,11 @@ dd {
   position: absolute;
   inset: 0;
   background:
-    radial-gradient(39.91% 77.37% at 60.22% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%),
+    radial-gradient(
+      39.91% 77.37% at 60.22% 50%,
+      rgba(0, 0, 0, 0) 0%,
+      rgba(0, 0, 0, 0.5) 100%
+    ),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 51.6%, var(--c-teal) 100%);
 }
 
@@ -814,24 +835,28 @@ dd {
   scroll-snap-type: x mandatory;
   scroll-behavior: smooth;
   scrollbar-width: none;
-  /* negative margin + padding keeps the card glow from being clipped by the scroller */
-  margin-inline: calc(var(--gap) * -1);
-  padding: var(--sp-4) var(--gap);
+  /* overflow-x:auto forces overflow-y to auto, so the hover glow (a ~3.75rem
+     blur) would be clipped by the scroller. Don't switch to overflow:visible —
+     that kills the horizontal scroll. Instead give the rail enough padding for
+     the glow to paint INSIDE the scroll box, and pull it back with an equal
+     negative margin so the visible spacing is unchanged. Scrolling stays intact. */
+  margin: calc(var(--sp-5) * -1) calc(var(--gap) * -1);
+  padding: 4.5rem var(--gap);
 }
 
 .rail::-webkit-scrollbar {
   display: none;
 }
 
-.rail>* {
+.rail > * {
   scroll-snap-align: start;
 }
 
-.rail--dest>* {
+.rail--dest > * {
   flex: 0 0 calc((100% - 4 * var(--gap)) / 5);
 }
 
-.rail--art>* {
+.rail--art > * {
   flex: 0 0 calc((100% - 2 * var(--gap)) / 3);
 }
 
@@ -870,7 +895,11 @@ dd {
   position: absolute;
   inset: 0;
   z-index: -1;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.65) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0) 35%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
 /* highlighted card — gradients copied from Figma */
@@ -884,7 +913,11 @@ dd {
 .dcard:hover::after,
 .dcard:focus-within::after {
   background:
-    linear-gradient(180deg, rgba(255, 255, 255, 0) 51.6%, rgba(255, 255, 255, 0.4) 100%),
+    linear-gradient(
+      180deg,
+      rgba(255, 255, 255, 0) 51.6%,
+      rgba(255, 255, 255, 0.4) 100%
+    ),
     linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 37.33%, #2cafc2 84.53%);
 }
@@ -897,7 +930,11 @@ dd {
 
 .rail:hover .dcard.is-active:not(:hover):not(:focus-within)::after,
 .rail:focus-within .dcard.is-active:not(:hover):not(:focus-within)::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.65) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0) 35%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
 .dcard__desc {
@@ -907,7 +944,9 @@ dd {
   top: clamp(2.75rem, 2rem + 2vw, 3.5rem);
   opacity: 0;
   transform: translateY(-0.375rem);
-  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease);
+  transition:
+    opacity 0.25s var(--ease),
+    transform 0.25s var(--ease);
 }
 
 .dcard.is-active .dcard__desc,
@@ -918,7 +957,9 @@ dd {
 }
 
 .rail:hover .dcard.is-active:not(:hover):not(:focus-within) .dcard__desc,
-.rail:focus-within .dcard.is-active:not(:hover):not(:focus-within) .dcard__desc {
+.rail:focus-within
+  .dcard.is-active:not(:hover):not(:focus-within)
+  .dcard__desc {
   opacity: 0;
   transform: translateY(-0.375rem);
 }
@@ -1039,7 +1080,8 @@ dd {
   object-fit: contain;
   object-position: left;
   /* Figma tints the blue coach towards the teal brand colour */
-  filter: hue-rotate(-32deg) saturate(1.15) drop-shadow(0 1rem 1.5rem rgba(0, 0, 0, 0.18));
+  filter: hue-rotate(-32deg) saturate(1.15)
+    drop-shadow(0 1rem 1.5rem rgba(0, 0, 0, 0.18));
 }
 
 .promo__note {
@@ -1085,7 +1127,12 @@ dd {
   position: absolute;
   inset: 0;
   z-index: -1;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.1) 45%, rgba(0, 0, 0, 0.6) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.45) 0%,
+    rgba(0, 0, 0, 0.1) 45%,
+    rgba(0, 0, 0, 0.6) 100%
+  );
 }
 
 .tcard.is-active,
@@ -1098,7 +1145,11 @@ dd {
 .tcard:hover::after,
 .tcard:focus-within::after {
   background:
-    radial-gradient(53.59% 137.34% at 50% 46.41%, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%),
+    radial-gradient(
+      53.59% 137.34% at 50% 46.41%,
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 0.4) 100%
+    ),
     linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 37.33%, #2cafc2 84.53%);
 }
@@ -1110,7 +1161,12 @@ dd {
 
 .bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within)::after,
 .bus__grid:focus-within .tcard.is-active:not(:hover):not(:focus-within)::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.1) 45%, rgba(0, 0, 0, 0.6) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.45) 0%,
+    rgba(0, 0, 0, 0.1) 45%,
+    rgba(0, 0, 0, 0.6) 100%
+  );
 }
 
 .tcard__k {
@@ -1164,11 +1220,13 @@ dd {
   right: -34%;
   top: 42%;
   height: 28%;
-  background: linear-gradient(90deg,
-      rgba(44, 175, 194, 0) 0%,
-      rgba(44, 175, 194, 0.16) 22%,
-      rgba(44, 175, 194, 0.2) 55%,
-      rgba(44, 175, 194, 0) 100%);
+  background: linear-gradient(
+    90deg,
+    rgba(44, 175, 194, 0) 0%,
+    rgba(44, 175, 194, 0.16) 22%,
+    rgba(44, 175, 194, 0.2) 55%,
+    rgba(44, 175, 194, 0) 100%
+  );
   /* small blur only — the band keeps its straight parallel edges */
   filter: blur(2px);
   /* 25deg == the roof ridge angle, measured off the artwork itself */
@@ -1295,8 +1353,20 @@ dd {
 .marquee {
   position: relative;
   overflow: hidden;
-  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
-  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
+  -webkit-mask-image: linear-gradient(
+    90deg,
+    transparent,
+    #000 8%,
+    #000 92%,
+    transparent
+  );
+  mask-image: linear-gradient(
+    90deg,
+    transparent,
+    #000 8%,
+    #000 92%,
+    transparent
+  );
 }
 
 .marquee__route {
@@ -1420,14 +1490,23 @@ dd {
   position: absolute;
   inset: 0;
   z-index: -1;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.65) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.35) 0%,
+    rgba(0, 0, 0, 0.05) 40%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
 .acard.is-active .acard__media::after,
 .acard:hover .acard__media::after,
 .acard:focus-within .acard__media::after {
   background:
-    radial-gradient(53.59% 137.34% at 50% 46.41%, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%),
+    radial-gradient(
+      53.59% 137.34% at 50% 46.41%,
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 0.4) 100%
+    ),
     linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 37.33%, #2cafc2 84.53%);
 }
@@ -1446,8 +1525,15 @@ dd {
   box-shadow: none;
 }
 
-.rail:hover .acard.is-active:not(:hover):not(:focus-within) .acard__media::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.65) 100%);
+.rail:hover
+  .acard.is-active:not(:hover):not(:focus-within)
+  .acard__media::after {
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.35) 0%,
+    rgba(0, 0, 0, 0.05) 40%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
 .acard__time {
@@ -1559,7 +1645,7 @@ dd {
   gap: var(--sp-4);
 }
 
-.acc+.acc {
+.acc + .acc {
   border-top: 1px solid var(--c-line);
   padding-top: var(--sp-4);
 }
@@ -1613,11 +1699,14 @@ dd {
   transition: grid-template-rows 0.3s var(--ease);
 }
 
-.acc__q[aria-expanded="true"]+.acc__a {
+/* The button sits inside an <h3>, so .acc__a is the h3's sibling — not the
+   button's. Match on the .acc wrapper's expanded state instead of an adjacent
+   sibling, which never matched through the heading. */
+.acc:has(.acc__q[aria-expanded="true"]) .acc__a {
   grid-template-rows: 1fr;
 }
 
-.acc__a>* {
+.acc__a > * {
   overflow: hidden;
 }
 
@@ -1634,7 +1723,8 @@ dd {
    ========================================================= */
 .footer {
   position: relative;
-  margin: calc(var(--sp-6) + var(--page-inset)) var(--page-inset) var(--page-inset);
+  margin: calc(var(--sp-6) + var(--page-inset)) var(--page-inset)
+    var(--page-inset);
   padding-block: var(--sp-6) 0;
   border-radius: var(--r-xl);
   color: var(--c-white);
@@ -1770,7 +1860,11 @@ dd {
   padding: var(--sp-4);
   padding-bottom: clamp(2rem, 1rem + 3vw, 3rem);
   border-radius: var(--r-pill) var(--r-pill) 0 0;
-  background: linear-gradient(180deg, rgba(44, 175, 194, 0.99) 0%, var(--c-teal-20) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(44, 175, 194, 0.99) 0%,
+    var(--c-teal-20) 100%
+  );
   box-shadow: 0 0.75rem 8.25rem var(--c-teal);
   -webkit-backdrop-filter: blur(4px);
   backdrop-filter: blur(4px);
@@ -1785,7 +1879,7 @@ dd {
    Responsive
    ========================================================= */
 @media (max-width: 78rem) {
-  .rail--dest>* {
+  .rail--dest > * {
     flex: 0 0 calc((100% - 3 * var(--gap)) / 4);
   }
 }
@@ -1813,7 +1907,7 @@ dd {
     max-width: none;
   }
 
-  .rail--dest>* {
+  .rail--dest > * {
     flex: 0 0 calc((100% - 2 * var(--gap)) / 3);
   }
 
@@ -1861,7 +1955,10 @@ dd {
     opacity: 0;
     visibility: hidden;
     transform: translateY(-0.5rem);
-    transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s;
+    transition:
+      opacity 0.25s var(--ease),
+      transform 0.25s var(--ease),
+      visibility 0.25s;
   }
 
   .nav.is-open {
@@ -1902,7 +1999,7 @@ dd {
     display: none;
   }
 
-  .nav__toggle[aria-expanded="true"]+.nav__submenu {
+  .nav__toggle[aria-expanded="true"] + .nav__submenu {
     display: grid;
   }
 
@@ -1915,7 +2012,7 @@ dd {
     width: 100%;
   }
 
-  .rail--art>* {
+  .rail--art > * {
     flex: 0 0 calc((100% - var(--gap)) / 2);
   }
 
@@ -1925,7 +2022,7 @@ dd {
 }
 
 @media (max-width: 48rem) {
-  .rail--dest>* {
+  .rail--dest > * {
     flex: 0 0 calc((100% - var(--gap)) / 2);
   }
 
@@ -1953,10 +2050,6 @@ dd {
 }
 
 @media (max-width: 40rem) {
-  .hero {
-    min-height: clamp(30rem, 84svh, 44rem);
-  }
-
   .booking {
     padding: var(--sp-2);
   }
@@ -1988,11 +2081,11 @@ dd {
     flex: 1 1 auto;
   }
 
-  .rail--dest>* {
+  .rail--dest > * {
     flex: 0 0 min(72%, 15rem);
   }
 
-  .rail--art>* {
+  .rail--art > * {
     flex: 0 0 min(85%, 22rem);
   }
 
@@ -2200,20 +2293,23 @@ dd {
   border-radius: 0.25rem;
   color: transparent;
   background: var(--c-white);
-  transition: color 0.2s var(--ease), background-color 0.2s var(--ease), border-color 0.2s var(--ease);
+  transition:
+    color 0.2s var(--ease),
+    background-color 0.2s var(--ease),
+    border-color 0.2s var(--ease);
 }
 
 .check:hover .check__box {
   border-color: rgba(0, 0, 0, 0.45);
 }
 
-.check__input:checked+.check__box {
+.check__input:checked + .check__box {
   color: var(--c-white);
   border-color: var(--c-black);
   background: var(--c-black);
 }
 
-.check__input:focus-visible+.check__box {
+.check__input:focus-visible + .check__box {
   outline: 2px solid var(--c-teal);
   outline-offset: 2px;
 }
@@ -2225,7 +2321,7 @@ dd {
   transition: opacity 0.2s var(--ease);
 }
 
-.check__input:checked~.check__text {
+.check__input:checked ~ .check__text {
   opacity: 1;
 }
 
@@ -2345,7 +2441,9 @@ dd {
   line-height: 1.5;
   text-align: justify;
   opacity: 0.7;
-  transition: color 0.25s var(--ease), opacity 0.25s var(--ease);
+  transition:
+    color 0.25s var(--ease),
+    opacity 0.25s var(--ease);
 }
 
 .titem.is-active .titem__desc,
@@ -2357,7 +2455,9 @@ dd {
 
 /* hovering any card in the grid hands the highlight over to it */
 .tgrid:hover .titem.is-active:not(:hover):not(:focus-within) .titem__desc,
-.tgrid:focus-within .titem.is-active:not(:hover):not(:focus-within) .titem__desc {
+.tgrid:focus-within
+  .titem.is-active:not(:hover):not(:focus-within)
+  .titem__desc {
   color: inherit;
   opacity: 0.7;
 }
@@ -2369,11 +2469,17 @@ dd {
 
 .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within)::after,
 .tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within)::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.65) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0) 35%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
 .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
-.tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot {
+.tgrid:focus-within
+  .dcard.is-active:not(:hover):not(:focus-within)
+  .ring-badge__dot {
   color: var(--c-white);
   background: var(--c-glass);
 }
@@ -2411,7 +2517,10 @@ dd {
   color: var(--c-black);
   background: transparent;
   cursor: pointer;
-  transition: color 0.2s var(--ease), background-color 0.2s var(--ease), border-color 0.2s var(--ease);
+  transition:
+    color 0.2s var(--ease),
+    background-color 0.2s var(--ease),
+    border-color 0.2s var(--ease);
 }
 
 .pager__num {
@@ -2530,7 +2639,8 @@ dd {
   --word: clamp(3rem, 0.4rem + 9.5vw, 11.25rem);
   min-height: clamp(26rem, 62svh, 38rem);
   margin: var(--page-inset);
-  padding-block: calc(var(--header-h) + var(--sp-5)) clamp(0.75rem, 0.4rem + 1vw, 1.5rem);
+  padding-block: calc(var(--header-h) + var(--sp-5))
+    clamp(0.75rem, 0.4rem + 1vw, 1.5rem);
   border-radius: var(--r-xl);
   isolation: isolate;
   overflow: clip;
@@ -2547,6 +2657,13 @@ dd {
   border-radius: inherit;
   object-fit: cover;
   object-position: center 26%;
+  /* Viator only ships ~720px images, which look soft blown up to a full-width
+     banner. Rather than fight it, lean in: a gentle blur turns the photo into an
+     intentional backdrop (the crisp image lives in the gallery lightbox). The
+     scale hides the blur's feathered edges, which overflow:clip on .hero-tour
+     then trims to the rounded frame. */
+  filter: blur(10px) saturate(1.12);
+  transform: scale(1.12);
 }
 
 .hero-tour__sky {
@@ -2555,8 +2672,17 @@ dd {
   z-index: -1;
   border-radius: inherit;
   background:
-    radial-gradient(70% 50% at 50% 100%, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 70%),
-    linear-gradient(180deg, rgba(27, 147, 166, 0.82) 0%, rgba(44, 175, 194, 0.62) 45%, rgba(111, 208, 221, 0.78) 100%);
+    radial-gradient(
+      70% 50% at 50% 100%,
+      rgba(255, 255, 255, 0.3) 0%,
+      rgba(255, 255, 255, 0) 70%
+    ),
+    linear-gradient(
+      180deg,
+      rgba(27, 147, 166, 0.55) 0%,
+      rgba(44, 175, 194, 0.42) 45%,
+      rgba(111, 208, 221, 0.72) 100%
+    );
 }
 
 .hero-tour__inner {
@@ -2590,7 +2716,7 @@ dd {
   font-weight: 500;
 }
 
-.crumbs__list li+li::before {
+.crumbs__list li + li::before {
   content: "/";
   margin-inline-end: var(--sp-1);
   opacity: 0.5;
@@ -2681,7 +2807,7 @@ dd {
   opacity: 0.7;
 }
 
-.tour__text+.tour__text {
+.tour__text + .tour__text {
   margin-block-start: var(--sp-3);
 }
 
@@ -2808,6 +2934,119 @@ dd {
   border-radius: var(--r-card);
 }
 
+.gallery img {
+  cursor: zoom-in;
+  transition: transform 0.25s var(--ease), filter 0.25s var(--ease);
+}
+
+.gallery img:hover {
+  filter: brightness(1.05);
+}
+
+/* =========================================================
+   Gallery lightbox (built by vc-design.js)
+   ========================================================= */
+.vc-lightbox {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  display: grid;
+  place-items: center;
+  padding: clamp(1rem, 0.5rem + 3vw, 3.5rem);
+  background: rgba(0, 0, 0, 0.86);
+  -webkit-backdrop-filter: blur(6px);
+  backdrop-filter: blur(6px);
+  opacity: 0;
+  visibility: hidden;
+  transition:
+    opacity 0.25s var(--ease),
+    visibility 0s linear 0.25s;
+}
+
+.vc-lightbox.is-open {
+  opacity: 1;
+  visibility: visible;
+  transition: opacity 0.25s var(--ease);
+}
+
+.vc-lightbox__img {
+  max-width: min(100%, 78rem);
+  max-height: 84vh;
+  width: auto;
+  height: auto;
+  border-radius: var(--r-card);
+  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.5);
+  transform: scale(0.96);
+  transition: transform 0.25s var(--ease), opacity 0.15s var(--ease);
+}
+
+.vc-lightbox.is-open .vc-lightbox__img {
+  transform: scale(1);
+}
+
+.vc-lightbox__btn {
+  position: absolute;
+  display: grid;
+  place-items: center;
+  width: 3rem;
+  height: 3rem;
+  padding: 0;
+  border: 0;
+  border-radius: var(--r-pill);
+  color: var(--c-white);
+  background: rgba(255, 255, 255, 0.12);
+  -webkit-backdrop-filter: blur(8px);
+  backdrop-filter: blur(8px);
+  cursor: pointer;
+  transition: background 0.2s var(--ease), transform 0.2s var(--ease);
+}
+
+.vc-lightbox__btn:hover {
+  background: rgba(255, 255, 255, 0.24);
+}
+
+.vc-lightbox__close {
+  top: clamp(1rem, 3vw, 2rem);
+  right: clamp(1rem, 3vw, 2rem);
+}
+
+.vc-lightbox__prev,
+.vc-lightbox__next {
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.vc-lightbox__prev {
+  left: clamp(0.5rem, 2vw, 2rem);
+}
+
+.vc-lightbox__next {
+  right: clamp(0.5rem, 2vw, 2rem);
+}
+
+.vc-lightbox__prev:hover,
+.vc-lightbox__next:hover {
+  transform: translateY(-50%) scale(1.06);
+}
+
+.vc-lightbox__count {
+  position: absolute;
+  bottom: clamp(1rem, 3vw, 2rem);
+  left: 50%;
+  transform: translateX(-50%);
+  color: rgba(255, 255, 255, 0.85);
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+}
+
+/* single image → hide the arrows */
+.vc-lightbox--single .vc-lightbox__prev,
+.vc-lightbox--single .vc-lightbox__next,
+.vc-lightbox--single .vc-lightbox__count {
+  display: none;
+}
+
 /* --- included / not included --- */
 .lists {
   display: grid;
diff --git a/viator-collector.zip b/viator-collector.zip
index 5d0bba9..0b6e702 100644
Binary files a/viator-collector.zip and b/viator-collector.zip differ
diff --git a/viator-collector/SHORTCODES.md b/viator-collector/SHORTCODES.md
index e56ca36..7673622 100644
--- a/viator-collector/SHORTCODES.md
+++ b/viator-collector/SHORTCODES.md
@@ -16,23 +16,31 @@ listing/single/section assets load only on pages that use them.
 | `[viator_top_tours]` | Rail of tour cards | `viator_tour` posts |
 | `[viator_top_attractions]` | Rail of tour cards | `viator_tour` posts |
 | `[viator_browse_activities]` | Rail of tour cards | `viator_tour` posts |
+| `[viator_bus_tours]` | "Open Top Bus Tours" promo + 4-up card grid | `viator_tour` posts |
+| `[viator_about]` | Static "About / Memorable" block + stat counters | Shortcode attributes |
+| `[viator_articles]` | Rail of latest blog-post cards | `post` posts |
 | `[viator_faq]` | FAQ accordion | Shortcode `items` / `vc_faq_items` filter |
 | `[viator_testimonials]` | Testimonials marquee | `vc_testimonials` filter |
 
 `[viator_hero_slider]` is kept as a **back-compat alias** for `[viator_hero]`.
 
-A typical home page:
+Home page matching the design mockup (`new front/index.html`), top to bottom:
 
 ```
-[viator_hero]
+[viator_hero image_id="125304"]
 [viator_top_destinations]
+[viator_bus_tours image_id="125310"]
 [viator_top_tours]
-[viator_top_attractions]
-[viator_browse_activities]
+[viator_about image_id="125311"]
 [viator_testimonials]
+[viator_articles]
 [viator_faq]
 ```
 
+Heavy decorative images (hero photo, open-top bus, isometric bus) are **not
+bundled** — upload them in **Media** and pass the attachment `image_id` (exactly
+like `[viator_hero image_id="…"]`). Icons and tiny decorations are inline SVG.
+
 ---
 
 ## `[viator_hero]`
@@ -99,6 +107,71 @@ are hidden automatically.
 
 ---
 
+## `[viator_bus_tours]`
+
+The "Open Top Bus Tours…" promo block (route line, headline, "See all", a chip,
+a bus illustration and note) followed by a 4-up grid of tour cards. Selects tours
+with the **same attributes as the tour rails** (`ids` / `codes` / `destination` /
+`tag` / `limit` / `orderby`), plus:
+
+| Attribute | Default | Description |
+|---|---|---|
+| `title` | `Open Top<br>Bus Tours…` | Promo headline (`<br>` allowed). |
+| `note` | *(default copy)* | Paragraph under the headline. |
+| `chip` | `Very Fun!` | Small accent chip. |
+| `image_id` | — | **Media attachment ID** of the open-top bus illustration. |
+| `image` | — | …or a direct image URL (use `image_id` when possible). |
+
+```
+[viator_bus_tours image_id="125310" tag="hop-on-hop-off" limit="4"]
+[viator_bus_tours ids="482,517,690,701"]
+```
+
+---
+
+## `[viator_about]`
+
+Static "About" marketing block: headline with an accent chip, a paragraph, four
+stat counters and a decorative isometric bus. All copy is editable.
+
+| Attribute | Default | Description |
+|---|---|---|
+| `title` | `Hop On Hop Off` | Headline. |
+| `highlight` | `Memorable` | Accent chip appended to the headline. |
+| `text` | *(default copy)* | Paragraph. |
+| `button_text` | `About us` | Button label. |
+| `button_url` | *(tours archive)* | Button link. |
+| `image_id` | — | **Media attachment ID** of the isometric bus illustration. |
+| `image` | — | …or a direct image URL. |
+| `stats` | *(4 defaults)* | `25+|Years Experience;;500+|Tours Conducted` — `|` separates number from label, `;;` separates stats. A trailing `+` is styled. |
+
+```
+[viator_about image_id="125311" stats="25+|Years Experience;;500+|Tours Conducted;;430+|Tours this Year;;15+|Different Tours"]
+```
+
+---
+
+## `[viator_articles]`
+
+A rail of the latest blog posts styled as the design's "Latest Articles" cards
+(featured image, relative time, title, excerpt → links to the post).
+
+| Attribute | Default | Description |
+|---|---|---|
+| `title` | `Latest<br>Articles` | Heading (`<br>` allowed). |
+| `lead` | *(default copy)* | Sub-heading. |
+| `limit` | `8` | Number of posts. |
+| `category` | — | Restrict to a category slug. |
+| `view_all` | *(posts page)* | "See all" link; defaults to the blog page. |
+
+Cards use each post's **featured image**; set one so the card isn't blank.
+
+```
+[viator_articles limit="8" category="travel-tips"]
+```
+
+---
+
 ## `[viator_faq]`
 
 FAQ accordion.
diff --git a/viator-collector/assets.zip b/viator-collector/assets.zip
index 0efb1e4..0099050 100644
Binary files a/viator-collector/assets.zip and b/viator-collector/assets.zip differ
diff --git a/viator-collector/assets/css/vc-design.css b/viator-collector/assets/css/vc-design.css
index 352189c..f60db63 100644
--- a/viator-collector/assets/css/vc-design.css
+++ b/viator-collector/assets/css/vc-design.css
@@ -46,21 +46,29 @@
 /* =========================================================
    Base
    ========================================================= */
-.vc-app *,
-.vc-app *::before,
-.vc-app *::after {
+.vc-app.vc-app *,
+.vc-app.vc-app *::before,
+.vc-app.vc-app *::after {
   box-sizing: border-box;
 }
 
-.vc-app {
+.vc-app.vc-app {
   -webkit-text-size-adjust: 100%;
   scroll-behavior: smooth;
   overflow-x: hidden;
 }
 
-.vc-app {
+.vc-app.vc-app {
   margin: 0;
-  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  font-family:
+    "Plus Jakarta Sans",
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    Helvetica,
+    Arial,
+    sans-serif;
   font-size: var(--fs-body);
   line-height: 1.5;
   color: var(--c-ink);
@@ -68,18 +76,18 @@
   overflow-x: hidden;
 }
 
-.vc-app img,
-.vc-app svg {
+.vc-app.vc-app img,
+.vc-app.vc-app svg {
   display: block;
   max-width: 100%;
 }
 
-.vc-app a {
+.vc-app.vc-app a {
   color: inherit;
   text-decoration: none;
 }
 
-.vc-app button {
+.vc-app.vc-app button {
   font: inherit;
   color: inherit;
   border: 0;
@@ -87,38 +95,38 @@
   cursor: pointer;
 }
 
-.vc-app ul,
-.vc-app ol {
+.vc-app.vc-app ul,
+.vc-app.vc-app ol {
   margin: 0;
   padding: 0;
   list-style: none;
 }
 
-.vc-app blockquote,
-.vc-app figure,
-.vc-app dl,
-.vc-app dd {
+.vc-app.vc-app blockquote,
+.vc-app.vc-app figure,
+.vc-app.vc-app dl,
+.vc-app.vc-app dd {
   margin: 0;
 }
 
-.vc-app :where(a,
-.vc-app button,
-.vc-app input,
-.vc-app select,
-.vc-app summary):focus-visible {
+.vc-app.vc-app :where(a,
+.vc-app.vc-app button,
+.vc-app.vc-app input,
+.vc-app.vc-app select,
+.vc-app.vc-app summary):focus-visible {
   outline: 2px solid var(--c-teal);
   outline-offset: 3px;
   border-radius: 0.25rem;
 }
 
-.vc-app .sprite {
+.vc-app.vc-app .sprite {
   position: absolute;
   width: 0;
   height: 0;
   overflow: hidden;
 }
 
-.vc-app .skip-link {
+.vc-app.vc-app .skip-link {
   position: absolute;
   left: -100vmax;
   top: var(--sp-1);
@@ -129,39 +137,39 @@
   color: var(--c-black);
 }
 
-.vc-app .skip-link:focus {
+.vc-app.vc-app .skip-link:focus {
   left: var(--sp-1);
 }
 
-.vc-app .container {
+.vc-app.vc-app .container {
   width: 100%;
   max-width: var(--container);
   margin-inline: auto;
   padding-inline: var(--gutter);
 }
 
-.vc-app .icon {
+.vc-app.vc-app .icon {
   width: 1rem;
   height: 1rem;
   flex: none;
 }
 
-.vc-app .icon--12 {
+.vc-app.vc-app .icon--12 {
   width: 0.75rem;
   height: 0.75rem;
 }
 
-.vc-app .icon--14 {
+.vc-app.vc-app .icon--14 {
   width: 0.875rem;
   height: 0.875rem;
 }
 
-.vc-app .icon--20 {
+.vc-app.vc-app .icon--20 {
   width: 1.25rem;
   height: 1.25rem;
 }
 
-.vc-app .icon--24 {
+.vc-app.vc-app .icon--24 {
   width: 1.5rem;
   height: 1.5rem;
 }
@@ -169,7 +177,7 @@
 /* =========================================================
    Buttons, pills, chips
    ========================================================= */
-.vc-app .btn {
+.vc-app.vc-app .btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -179,49 +187,52 @@
   border-radius: var(--r-pill);
   font-weight: 700;
   white-space: nowrap;
-  transition: transform 0.2s var(--ease), filter 0.2s var(--ease), background 0.2s var(--ease);
+  transition:
+    transform 0.2s var(--ease),
+    filter 0.2s var(--ease),
+    background 0.2s var(--ease);
 }
 
-.vc-app .btn:hover {
+.vc-app.vc-app .btn:hover {
   filter: brightness(0.94);
   transform: translateY(-1px);
 }
 
-.vc-app .btn--accent {
+.vc-app.vc-app .btn--accent {
   background: var(--c-accent);
   color: var(--c-black);
 }
 
-.vc-app .btn--dark {
+.vc-app.vc-app .btn--dark {
   background: var(--c-black);
   color: var(--c-white);
 }
 
-.vc-app .btn--white {
+.vc-app.vc-app .btn--white {
   background: var(--c-white);
   color: var(--c-black);
   font-weight: 500;
 }
 
-.vc-app .btn--ghost {
+.vc-app.vc-app .btn--ghost {
   border: 1px solid var(--c-line);
   background: var(--c-white);
   color: var(--c-black);
   font-weight: 500;
 }
 
-.vc-app .btn--ghost:hover {
+.vc-app.vc-app .btn--ghost:hover {
   filter: none;
   background: rgba(0, 0, 0, 0.04);
 }
 
-.vc-app .btn--wide {
+.vc-app.vc-app .btn--wide {
   justify-content: space-between;
   width: 100%;
   padding-inline: var(--sp-3);
 }
 
-.vc-app .icon-btn {
+.vc-app.vc-app .icon-btn {
   display: inline-grid;
   place-items: center;
   aspect-ratio: 1;
@@ -234,11 +245,11 @@
   transition: background 0.2s var(--ease);
 }
 
-.vc-app .icon-btn:hover {
+.vc-app.vc-app .icon-btn:hover {
   background: rgba(0, 0, 0, 0.7);
 }
 
-.vc-app .pill {
+.vc-app.vc-app .pill {
   display: inline-flex;
   align-items: center;
   gap: var(--sp-1);
@@ -251,7 +262,7 @@
   backdrop-filter: blur(12px);
 }
 
-.vc-app .chip {
+.vc-app.vc-app .chip {
   display: inline-flex;
   align-items: center;
   gap: var(--sp-1);
@@ -263,12 +274,12 @@
   white-space: nowrap;
 }
 
-.vc-app .chip--accent {
+.vc-app.vc-app .chip--accent {
   background: var(--c-accent);
   color: var(--c-black);
 }
 
-.vc-app .chip--glass {
+.vc-app.vc-app .chip--glass {
   color: var(--c-white);
   background: var(--c-glass);
   font-weight: 400;
@@ -276,7 +287,7 @@
   backdrop-filter: blur(12px);
 }
 
-.vc-app .rating {
+.vc-app.vc-app .rating {
   position: absolute;
   left: var(--sp-2);
   top: var(--sp-2);
@@ -292,16 +303,16 @@
   backdrop-filter: blur(12px);
 }
 
-.vc-app .rating__star {
+.vc-app.vc-app .rating__star {
   color: var(--c-accent);
 }
 
-.vc-app .rating b {
+.vc-app.vc-app .rating b {
   font-size: 0.875rem;
   font-weight: 500;
 }
 
-.vc-app .rating i {
+.vc-app.vc-app .rating i {
   font-size: 0.75rem;
   font-style: normal;
   font-weight: 500;
@@ -309,19 +320,19 @@
 }
 
 /* key / value pairs used on the cards */
-.vc-app .meta {
+.vc-app.vc-app .meta {
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
   min-width: 0;
 }
 
-.vc-app .meta__k {
+.vc-app.vc-app .meta__k {
   font-size: 0.75rem;
   font-weight: 500;
 }
 
-.vc-app .meta__v {
+.vc-app.vc-app .meta__v {
   font-size: 1rem;
   font-weight: 800;
 }
@@ -329,7 +340,7 @@
 /* =========================================================
    Circular "ring" badge (scroll cue, book now, back to top)
    ========================================================= */
-.vc-app .ring-badge {
+.vc-app.vc-app .ring-badge {
   position: relative;
   display: grid;
   place-items: center;
@@ -338,7 +349,7 @@
   flex: none;
 }
 
-.vc-app .ring-badge__ring {
+.vc-app.vc-app .ring-badge__ring {
   position: absolute;
   inset: 0;
   width: 100%;
@@ -347,7 +358,7 @@
   animation: spin 16s linear infinite;
 }
 
-.vc-app .ring-badge__text {
+.vc-app.vc-app .ring-badge__text {
   fill: currentColor;
   font-size: 0.75rem;
   font-weight: 700;
@@ -355,7 +366,7 @@
   text-transform: uppercase;
 }
 
-.vc-app .ring-badge__dot {
+.vc-app.vc-app .ring-badge__dot {
   display: grid;
   place-items: center;
   padding: var(--sp-1);
@@ -367,29 +378,31 @@
   transition: transform 0.2s var(--ease);
 }
 
-.vc-app .ring-badge:hover .ring-badge__dot {
+.vc-app.vc-app .ring-badge:hover .ring-badge__dot {
   transform: scale(1.08);
 }
 
-.vc-app .ring-badge--accent .ring-badge__dot,
-.vc-app .dcard:hover .ring-badge--card .ring-badge__dot,
-.vc-app .dcard:focus-within .ring-badge--card .ring-badge__dot,
-.vc-app .tcard:hover .ring-badge--card .ring-badge__dot,
-.vc-app .tcard:focus-within .ring-badge--card .ring-badge__dot,
-.vc-app .acard:hover .ring-badge--card .ring-badge__dot,
-.vc-app .acard:focus-within .ring-badge--card .ring-badge__dot {
+.vc-app.vc-app .ring-badge--accent .ring-badge__dot,
+.vc-app.vc-app .dcard:hover .ring-badge--card .ring-badge__dot,
+.vc-app.vc-app .dcard:focus-within .ring-badge--card .ring-badge__dot,
+.vc-app.vc-app .tcard:hover .ring-badge--card .ring-badge__dot,
+.vc-app.vc-app .tcard:focus-within .ring-badge--card .ring-badge__dot,
+.vc-app.vc-app .acard:hover .ring-badge--card .ring-badge__dot,
+.vc-app.vc-app .acard:focus-within .ring-badge--card .ring-badge__dot {
   color: var(--c-black);
   background: var(--c-accent);
 }
 
-.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
-.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
-.vc-app .bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot {
+.vc-app.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
+.vc-app.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
+.vc-app.vc-app .bus__grid:hover
+  .tcard.is-active:not(:hover):not(:focus-within)
+  .ring-badge__dot {
   color: var(--c-white);
   background: var(--c-glass);
 }
 
-.vc-app .ring-badge--scroll {
+.vc-app.vc-app .ring-badge--scroll {
   position: absolute;
   left: 50%;
   bottom: 0;
@@ -399,20 +412,20 @@
   transform: translate(-50%, 50%);
 }
 
-.vc-app .ring-badge--card {
+.vc-app.vc-app .ring-badge--card {
   width: clamp(2.875rem, 2.4rem + 1.6vw, 3.875rem);
   color: var(--c-white);
 }
 
-.vc-app .ring-badge--card .ring-badge__text {
+.vc-app.vc-app .ring-badge--card .ring-badge__text {
   font-size: 0.875rem;
 }
 
-.vc-app .ring-badge--card .ring-badge__dot {
+.vc-app.vc-app .ring-badge--card .ring-badge__dot {
   padding: 0.4375rem;
 }
 
-.vc-app .ring-badge--top {
+.vc-app.vc-app .ring-badge--top {
   position: absolute;
   left: 50%;
   top: 0;
@@ -420,12 +433,12 @@
   transform: translate(-50%, -50%);
 }
 
-.vc-app .ring-badge--top .ring-badge__text {
+.vc-app.vc-app .ring-badge--top .ring-badge__text {
   font-size: 0.625rem;
   letter-spacing: 0.02em;
 }
 
-.vc-app .ring-badge--scroll .ring-badge__dot .icon {
+.vc-app.vc-app .ring-badge--scroll .ring-badge__dot .icon {
   animation: nudge 2s var(--ease) infinite;
 }
 
@@ -436,7 +449,6 @@
 }
 
 @keyframes nudge {
-
   0%,
   60%,
   100% {
@@ -451,7 +463,7 @@
 /* =========================================================
    Header
    ========================================================= */
-.vc-app .site-header {
+.vc-app.vc-app .site-header {
   position: absolute;
   inset: var(--page-inset) 0 auto;
   z-index: 20;
@@ -459,7 +471,7 @@
   color: var(--c-white);
 }
 
-.vc-app .site-header.is-stuck {
+.vc-app.vc-app .site-header.is-stuck {
   position: fixed;
   inset-block-start: 0;
   padding-block: var(--sp-2);
@@ -475,38 +487,38 @@
   }
 }
 
-.vc-app .header__inner {
+.vc-app.vc-app .header__inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--sp-4);
 }
 
-.vc-app .header__left {
+.vc-app.vc-app .header__left {
   display: flex;
   align-items: center;
   gap: clamp(1.5rem, 0.2rem + 4.5vw, 6rem);
   min-width: 0;
 }
 
-.vc-app .header__logo .logo {
+.vc-app.vc-app .header__logo .logo {
   width: clamp(4.25rem, 3.6rem + 1.6vw, 5.6875rem);
   height: auto;
 }
 
-.vc-app .header__actions {
+.vc-app.vc-app .header__actions {
   display: flex;
   align-items: center;
   gap: var(--sp-1);
 }
 
-.vc-app .nav__list {
+.vc-app.vc-app .nav__list {
   display: flex;
   align-items: center;
   gap: clamp(1rem, 0.1rem + 1.8vw, 2.5rem);
 }
 
-.vc-app .nav__link {
+.vc-app.vc-app .nav__link {
   display: inline-flex;
   align-items: center;
   gap: var(--sp-1);
@@ -515,23 +527,23 @@
   transition: opacity 0.2s var(--ease);
 }
 
-.vc-app .nav__link:hover {
+.vc-app.vc-app .nav__link:hover {
   opacity: 0.7;
 }
 
-.vc-app .nav__item--has-menu {
+.vc-app.vc-app .nav__item--has-menu {
   position: relative;
 }
 
-.vc-app .nav__toggle .icon--chevron {
+.vc-app.vc-app .nav__toggle .icon--chevron {
   transition: transform 0.25s var(--ease);
 }
 
-.vc-app .nav__toggle[aria-expanded="true"] .icon--chevron {
+.vc-app.vc-app .nav__toggle[aria-expanded="true"] .icon--chevron {
   transform: rotate(180deg);
 }
 
-.vc-app .nav__submenu {
+.vc-app.vc-app .nav__submenu {
   position: absolute;
   top: calc(100% + var(--sp-2));
   left: 0;
@@ -547,32 +559,35 @@
   opacity: 0;
   visibility: hidden;
   transform: translateY(-0.375rem);
-  transition: opacity 0.2s var(--ease), transform 0.2s var(--ease), visibility 0.2s;
+  transition:
+    opacity 0.2s var(--ease),
+    transform 0.2s var(--ease),
+    visibility 0.2s;
 }
 
-.vc-app .nav__item--has-menu:hover .nav__submenu,
-.vc-app .nav__toggle[aria-expanded="true"]+.nav__submenu {
+.vc-app.vc-app .nav__item--has-menu:hover .nav__submenu,
+.vc-app.vc-app .nav__toggle[aria-expanded="true"] + .nav__submenu {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
 }
 
-.vc-app .nav__submenu a {
+.vc-app.vc-app .nav__submenu a {
   display: block;
   padding: var(--sp-1) var(--sp-3);
   border-radius: var(--r-pill);
   font-weight: 500;
 }
 
-.vc-app .nav__submenu a:hover {
+.vc-app.vc-app .nav__submenu a:hover {
   background: rgba(0, 0, 0, 0.06);
 }
 
-.vc-app .nav__mobile-cta {
+.vc-app.vc-app .nav__mobile-cta {
   display: none;
 }
 
-.vc-app .burger {
+.vc-app.vc-app .burger {
   display: none;
   place-content: center;
   place-items: center;
@@ -585,42 +600,44 @@
   backdrop-filter: blur(12px);
 }
 
-.vc-app .burger span {
+.vc-app.vc-app .burger span {
   display: block;
   width: 1.125rem;
   height: 0.125rem;
   border-radius: 1px;
   background: var(--c-white);
-  transition: transform 0.25s var(--ease), opacity 0.25s var(--ease);
+  transition:
+    transform 0.25s var(--ease),
+    opacity 0.25s var(--ease);
 }
 
-.vc-app .burger[aria-expanded="true"] span:nth-child(1) {
+.vc-app.vc-app .burger[aria-expanded="true"] span:nth-child(1) {
   transform: translateY(0.375rem) rotate(45deg);
 }
 
-.vc-app .burger[aria-expanded="true"] span:nth-child(2) {
+.vc-app.vc-app .burger[aria-expanded="true"] span:nth-child(2) {
   opacity: 0;
 }
 
-.vc-app .burger[aria-expanded="true"] span:nth-child(3) {
+.vc-app.vc-app .burger[aria-expanded="true"] span:nth-child(3) {
   transform: translateY(-0.375rem) rotate(-45deg);
 }
 
 /* =========================================================
    Hero
    ========================================================= */
-.vc-app .hero {
+.vc-app.vc-app .hero {
   position: relative;
   display: grid;
   align-items: end;
-  min-height: clamp(34rem, 88svh, 56rem);
   margin: var(--page-inset);
-  padding-block: calc(var(--header-h) + var(--sp-6)) clamp(3rem, 1.5rem + 6vw, 6rem);
+  padding-block: calc(var(--header-h) + var(--sp-6))
+    clamp(3rem, 1.5rem + 6vw, 6rem);
   border-radius: var(--r-xl);
   isolation: isolate;
 }
 
-.vc-app .hero__media {
+.vc-app.vc-app .hero__media {
   position: absolute;
   inset: 0;
   z-index: -1;
@@ -628,7 +645,7 @@
   overflow: clip;
 }
 
-.vc-app .hero__img {
+.vc-app.vc-app .hero__img {
   width: 100%;
   height: 100%;
   object-fit: cover;
@@ -636,15 +653,19 @@
 }
 
 /* Figma gradients: radial vignette + teal fade into the next section */
-.vc-app .hero__scrim {
+.vc-app.vc-app .hero__scrim {
   position: absolute;
   inset: 0;
   background:
-    radial-gradient(39.91% 77.37% at 60.22% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%),
+    radial-gradient(
+      39.91% 77.37% at 60.22% 50%,
+      rgba(0, 0, 0, 0) 0%,
+      rgba(0, 0, 0, 0.5) 100%
+    ),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 51.6%, var(--c-teal) 100%);
 }
 
-.vc-app .hero__content {
+.vc-app.vc-app .hero__content {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -652,12 +673,12 @@
   text-align: left;
 }
 
-.vc-app .hero__eyebrow {
+.vc-app.vc-app .hero__eyebrow {
   order: 1;
   font-size: 1rem;
 }
 
-.vc-app .hero__title {
+.vc-app.vc-app .hero__title {
   order: 2;
   /* em keeps the two-line break ("Set out on" / "the journey.") at every size */
   max-width: 5.4em;
@@ -669,7 +690,7 @@
   color: var(--c-white);
 }
 
-.vc-app .booking {
+.vc-app.vc-app .booking {
   order: 3;
   width: 100%;
   max-width: 46.625rem;
@@ -679,13 +700,13 @@
   box-shadow: 0 1.5rem 3.5rem rgba(0, 0, 0, 0.18);
 }
 
-.vc-app .booking__row {
+.vc-app.vc-app .booking__row {
   display: flex;
   align-items: flex-end;
   gap: var(--sp-3);
 }
 
-.vc-app .field {
+.vc-app.vc-app .field {
   display: flex;
   flex: 1 1 0;
   flex-direction: column;
@@ -693,7 +714,7 @@
   min-width: 0;
 }
 
-.vc-app .field__label {
+.vc-app.vc-app .field__label {
   display: flex;
   align-items: center;
   gap: var(--sp-1);
@@ -702,17 +723,17 @@
   color: var(--c-black);
 }
 
-.vc-app .field__label label {
+.vc-app.vc-app .field__label label {
   cursor: pointer;
 }
 
-.vc-app .select {
+.vc-app.vc-app .select {
   position: relative;
   display: flex;
   align-items: center;
 }
 
-.vc-app .select__input {
+.vc-app.vc-app .select__input {
   width: 100%;
   min-width: 0;
   min-height: var(--control-h);
@@ -729,43 +750,43 @@
   transition: border-color 0.2s var(--ease);
 }
 
-.vc-app .select__input::placeholder {
+.vc-app.vc-app .select__input::placeholder {
   color: var(--c-black);
   opacity: 1;
 }
 
-.vc-app .select__input:hover {
+.vc-app.vc-app .select__input:hover {
   border-color: rgba(0, 0, 0, 0.3);
 }
 
-.vc-app .select__input--date::-webkit-calendar-picker-indicator {
+.vc-app.vc-app .select__input--date::-webkit-calendar-picker-indicator {
   opacity: 0;
   cursor: pointer;
 }
 
-.vc-app .select__chevron {
+.vc-app.vc-app .select__chevron {
   position: absolute;
   right: var(--sp-3);
   pointer-events: none;
   color: var(--c-black);
 }
 
-.vc-app .booking__submit {
+.vc-app.vc-app .booking__submit {
   flex: none;
 }
 
 /* =========================================================
    Section shell + section header
    ========================================================= */
-.vc-app .section {
+.vc-app.vc-app .section {
   padding-block: var(--sp-6);
 }
 
-.vc-app .section--tight {
+.vc-app.vc-app .section--tight {
   padding-block-start: 0;
 }
 
-.vc-app .sec-head {
+.vc-app.vc-app .sec-head {
   display: grid;
   grid-template-columns: auto minmax(0, 1fr) auto;
   align-items: center;
@@ -773,7 +794,7 @@
   margin-bottom: var(--sp-6);
 }
 
-.vc-app .sec-head__title {
+.vc-app.vc-app .sec-head__title {
   margin: 0;
   font-size: var(--fs-h2);
   font-weight: 800;
@@ -781,31 +802,31 @@
   letter-spacing: -0.03em;
 }
 
-.vc-app .sec-head__lead {
+.vc-app.vc-app .sec-head__lead {
   max-width: 40ch;
   margin: 0;
   opacity: 0.7;
   font-weight: 500;
 }
 
-.vc-app .sec-head__actions {
+.vc-app.vc-app .sec-head__actions {
   display: flex;
   flex-direction: column;
   gap: var(--sp-1);
   width: clamp(8rem, 6rem + 4vw, 9.125rem);
 }
 
-.vc-app .rail-nav {
+.vc-app.vc-app .rail-nav {
   display: flex;
   gap: var(--sp-1);
 }
 
-.vc-app .rail-nav__btn {
+.vc-app.vc-app .rail-nav__btn {
   flex: 1 1 0;
   padding-inline: var(--sp-3);
 }
 
-.vc-app .rail-nav__btn[disabled] {
+.vc-app.vc-app .rail-nav__btn[disabled] {
   opacity: 0.35;
   cursor: not-allowed;
 }
@@ -813,38 +834,42 @@
 /* =========================================================
    Horizontal rails
    ========================================================= */
-.vc-app .rail {
+.vc-app.vc-app .rail {
   display: flex;
   gap: var(--gap);
   overflow-x: auto;
   scroll-snap-type: x mandatory;
   scroll-behavior: smooth;
   scrollbar-width: none;
-  /* negative margin + padding keeps the card glow from being clipped by the scroller */
-  margin-inline: calc(var(--gap) * -1);
-  padding: var(--sp-4) var(--gap);
+  /* overflow-x:auto forces overflow-y to auto, so the hover glow (a ~3.75rem
+     blur) would be clipped by the scroller. Don't switch to overflow:visible —
+     that kills the horizontal scroll. Instead give the rail enough padding for
+     the glow to paint INSIDE the scroll box, and pull it back with an equal
+     negative margin so the visible spacing is unchanged. Scrolling stays intact. */
+  margin: calc(var(--sp-5) * -1) calc(var(--gap) * -1);
+  padding: 4.5rem var(--gap);
 }
 
-.vc-app .rail::-webkit-scrollbar {
+.vc-app.vc-app .rail::-webkit-scrollbar {
   display: none;
 }
 
-.vc-app .rail>* {
+.vc-app.vc-app .rail > * {
   scroll-snap-align: start;
 }
 
-.vc-app .rail--dest>* {
+.vc-app.vc-app .rail--dest > * {
   flex: 0 0 calc((100% - 4 * var(--gap)) / 5);
 }
 
-.vc-app .rail--art>* {
+.vc-app.vc-app .rail--art > * {
   flex: 0 0 calc((100% - 2 * var(--gap)) / 3);
 }
 
 /* =========================================================
    Destination card
    ========================================================= */
-.vc-app .dcard {
+.vc-app.vc-app .dcard {
   position: relative;
   display: flex;
   flex-direction: column;
@@ -858,11 +883,11 @@
   transition: transform 0.3s var(--ease);
 }
 
-.vc-app .dcard:hover {
+.vc-app.vc-app .dcard:hover {
   transform: translateY(-0.25rem);
 }
 
-.vc-app .dcard__img {
+.vc-app.vc-app .dcard__img {
   position: absolute;
   inset: 0;
   z-index: -2;
@@ -871,118 +896,134 @@
   object-fit: cover;
 }
 
-.vc-app .dcard::after {
+.vc-app.vc-app .dcard::after {
   content: "";
   position: absolute;
   inset: 0;
   z-index: -1;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.65) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0) 35%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
 /* highlighted card — gradients copied from Figma */
-.vc-app .dcard.is-active,
-.vc-app .dcard:hover,
-.vc-app .dcard:focus-within {
+.vc-app.vc-app .dcard.is-active,
+.vc-app.vc-app .dcard:hover,
+.vc-app.vc-app .dcard:focus-within {
   box-shadow: 0 0.75rem 3.75rem 0 rgba(44, 175, 194, 0.5);
 }
 
-.vc-app .dcard.is-active::after,
-.vc-app .dcard:hover::after,
-.vc-app .dcard:focus-within::after {
+.vc-app.vc-app .dcard.is-active::after,
+.vc-app.vc-app .dcard:hover::after,
+.vc-app.vc-app .dcard:focus-within::after {
   background:
-    linear-gradient(180deg, rgba(255, 255, 255, 0) 51.6%, rgba(255, 255, 255, 0.4) 100%),
+    linear-gradient(
+      180deg,
+      rgba(255, 255, 255, 0) 51.6%,
+      rgba(255, 255, 255, 0.4) 100%
+    ),
     linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 37.33%, #2cafc2 84.53%);
 }
 
 /* hovering any card in the rail hands the highlight over to it */
-.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within),
-.vc-app .rail:focus-within .dcard.is-active:not(:hover):not(:focus-within) {
+.vc-app.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within),
+.vc-app.vc-app .rail:focus-within .dcard.is-active:not(:hover):not(:focus-within) {
   box-shadow: none;
 }
 
-.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within)::after,
-.vc-app .rail:focus-within .dcard.is-active:not(:hover):not(:focus-within)::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.65) 100%);
+.vc-app.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within)::after,
+.vc-app.vc-app .rail:focus-within .dcard.is-active:not(:hover):not(:focus-within)::after {
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0) 35%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
-.vc-app .dcard__desc {
+.vc-app.vc-app .dcard__desc {
   position: absolute;
   left: clamp(0.75rem, 0.4rem + 1vw, 1.25rem);
   right: clamp(0.75rem, 0.4rem + 1vw, 1.25rem);
   top: clamp(2.75rem, 2rem + 2vw, 3.5rem);
   opacity: 0;
   transform: translateY(-0.375rem);
-  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease);
+  transition:
+    opacity 0.25s var(--ease),
+    transform 0.25s var(--ease);
 }
 
-.vc-app .dcard.is-active .dcard__desc,
-.vc-app .dcard:hover .dcard__desc,
-.vc-app .dcard:focus-within .dcard__desc {
+.vc-app.vc-app .dcard.is-active .dcard__desc,
+.vc-app.vc-app .dcard:hover .dcard__desc,
+.vc-app.vc-app .dcard:focus-within .dcard__desc {
   opacity: 1;
   transform: translateY(0);
 }
 
-.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within) .dcard__desc,
-.vc-app .rail:focus-within .dcard.is-active:not(:hover):not(:focus-within) .dcard__desc {
+.vc-app.vc-app .rail:hover .dcard.is-active:not(:hover):not(:focus-within) .dcard__desc,
+.vc-app.vc-app .rail:focus-within
+  .dcard.is-active:not(:hover):not(:focus-within)
+  .dcard__desc {
   opacity: 0;
   transform: translateY(-0.375rem);
 }
 
-.vc-app .dcard__desc-k {
+.vc-app.vc-app .dcard__desc-k {
   display: block;
   font-size: 0.75rem;
   font-weight: 500;
   opacity: 0.5;
 }
 
-.vc-app .dcard__desc p {
+.vc-app.vc-app .dcard__desc p {
   margin: 0.25rem 0 0;
   font-size: 0.875rem;
   font-weight: 500;
   line-height: 1.45;
 }
 
-.vc-app .dcard__body {
+.vc-app.vc-app .dcard__body {
   display: grid;
   gap: var(--sp-2);
 }
 
-.vc-app .dcard__title {
+.vc-app.vc-app .dcard__title {
   margin: 0;
   font-size: var(--fs-card);
   font-weight: 500;
   letter-spacing: -0.01em;
 }
 
-.vc-app .dcard__meta {
+.vc-app.vc-app .dcard__meta {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: var(--sp-2);
 }
 
-.vc-app .dcard__meta .ring-badge {
+.vc-app.vc-app .dcard__meta .ring-badge {
   margin-inline-start: auto;
 }
 
 /* =========================================================
    Open Top Bus Tours (promo + 2x2 grid)
    ========================================================= */
-.vc-app .bus {
+.vc-app.vc-app .bus {
   display: grid;
   grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
   gap: var(--gap);
   align-items: start;
 }
 
-.vc-app .bus__grid {
+.vc-app.vc-app .bus__grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--gap);
 }
 
-.vc-app .promo {
+.vc-app.vc-app .promo {
   position: relative;
   display: flex;
   flex-direction: column;
@@ -994,7 +1035,7 @@
   isolation: isolate;
 }
 
-.vc-app .promo__route {
+.vc-app.vc-app .promo__route {
   position: absolute;
   inset: 0;
   z-index: -1;
@@ -1003,14 +1044,14 @@
   opacity: 0.5;
 }
 
-.vc-app .promo__head {
+.vc-app.vc-app .promo__head {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   gap: var(--sp-3);
 }
 
-.vc-app .promo__title {
+.vc-app.vc-app .promo__title {
   margin: 0;
   font-size: var(--fs-h2);
   font-weight: 800;
@@ -1019,13 +1060,13 @@
   opacity: 0.8;
 }
 
-.vc-app .promo__chip {
+.vc-app.vc-app .promo__chip {
   align-self: flex-start;
   margin-top: calc(var(--sp-1) * -1);
   transform: rotate(-6deg);
 }
 
-.vc-app .promo__bus {
+.vc-app.vc-app .promo__bus {
   position: relative;
   /* basis 0 so the coach takes only the space the title and note leave over */
   flex: 1 1 0;
@@ -1037,7 +1078,7 @@
   padding-left: 2.5rem;
 }
 
-.vc-app .promo__bus img {
+.vc-app.vc-app .promo__bus img {
   width: 100%;
   height: 100%;
   /* grid items default to min-height:auto, which would keep the intrinsic height */
@@ -1045,10 +1086,11 @@
   object-fit: contain;
   object-position: left;
   /* Figma tints the blue coach towards the teal brand colour */
-  filter: hue-rotate(-32deg) saturate(1.15) drop-shadow(0 1rem 1.5rem rgba(0, 0, 0, 0.18));
+  filter: hue-rotate(-32deg) saturate(1.15)
+    drop-shadow(0 1rem 1.5rem rgba(0, 0, 0, 0.18));
 }
 
-.vc-app .promo__note {
+.vc-app.vc-app .promo__note {
   margin: 0;
   margin-inline-start: auto;
   max-width: 15rem;
@@ -1059,7 +1101,7 @@
 /* =========================================================
    Wide tour card
    ========================================================= */
-.vc-app .tcard {
+.vc-app.vc-app .tcard {
   position: relative;
   display: flex;
   flex-direction: column;
@@ -1073,11 +1115,11 @@
   transition: transform 0.3s var(--ease);
 }
 
-.vc-app .tcard:hover {
+.vc-app.vc-app .tcard:hover {
   transform: translateY(-0.25rem);
 }
 
-.vc-app .tcard__img {
+.vc-app.vc-app .tcard__img {
   position: absolute;
   inset: 0;
   z-index: -2;
@@ -1086,46 +1128,60 @@
   object-fit: cover;
 }
 
-.vc-app .tcard::after {
+.vc-app.vc-app .tcard::after {
   content: "";
   position: absolute;
   inset: 0;
   z-index: -1;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.1) 45%, rgba(0, 0, 0, 0.6) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.45) 0%,
+    rgba(0, 0, 0, 0.1) 45%,
+    rgba(0, 0, 0, 0.6) 100%
+  );
 }
 
-.vc-app .tcard.is-active,
-.vc-app .tcard:hover,
-.vc-app .tcard:focus-within {
+.vc-app.vc-app .tcard.is-active,
+.vc-app.vc-app .tcard:hover,
+.vc-app.vc-app .tcard:focus-within {
   box-shadow: 0 0.75rem 3.75rem 0 rgba(44, 175, 194, 0.5);
 }
 
-.vc-app .tcard.is-active::after,
-.vc-app .tcard:hover::after,
-.vc-app .tcard:focus-within::after {
+.vc-app.vc-app .tcard.is-active::after,
+.vc-app.vc-app .tcard:hover::after,
+.vc-app.vc-app .tcard:focus-within::after {
   background:
-    radial-gradient(53.59% 137.34% at 50% 46.41%, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%),
+    radial-gradient(
+      53.59% 137.34% at 50% 46.41%,
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 0.4) 100%
+    ),
     linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 37.33%, #2cafc2 84.53%);
 }
 
-.vc-app .bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within),
-.vc-app .bus__grid:focus-within .tcard.is-active:not(:hover):not(:focus-within) {
+.vc-app.vc-app .bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within),
+.vc-app.vc-app .bus__grid:focus-within .tcard.is-active:not(:hover):not(:focus-within) {
   box-shadow: none;
 }
 
-.vc-app .bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within)::after,
-.vc-app .bus__grid:focus-within .tcard.is-active:not(:hover):not(:focus-within)::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.1) 45%, rgba(0, 0, 0, 0.6) 100%);
+.vc-app.vc-app .bus__grid:hover .tcard.is-active:not(:hover):not(:focus-within)::after,
+.vc-app.vc-app .bus__grid:focus-within .tcard.is-active:not(:hover):not(:focus-within)::after {
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.45) 0%,
+    rgba(0, 0, 0, 0.1) 45%,
+    rgba(0, 0, 0, 0.6) 100%
+  );
 }
 
-.vc-app .tcard__k {
+.vc-app.vc-app .tcard__k {
   font-size: 0.75rem;
   font-weight: 500;
   opacity: 0.9;
 }
 
-.vc-app .tcard__title {
+.vc-app.vc-app .tcard__title {
   max-width: 14ch;
   margin: 0;
   font-size: var(--fs-card);
@@ -1134,7 +1190,7 @@
   letter-spacing: -0.01em;
 }
 
-.vc-app .tcard__bottom {
+.vc-app.vc-app .tcard__bottom {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
@@ -1144,14 +1200,14 @@
 /* =========================================================
    About
    ========================================================= */
-.vc-app .about {
+.vc-app.vc-app .about {
   display: grid;
   grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr);
   align-items: center;
   gap: clamp(1.5rem, 0.5rem + 3vw, 3rem);
 }
 
-.vc-app .about__art {
+.vc-app.vc-app .about__art {
   position: relative;
   display: grid;
   place-items: center;
@@ -1159,22 +1215,24 @@
   color: var(--c-teal);
 }
 
-.vc-app .about__glow {
+.vc-app.vc-app .about__glow {
   display: none;
 }
 
 /* straight speed-trail band running along the coach's axis */
-.vc-app .about__trail {
+.vc-app.vc-app .about__trail {
   position: absolute;
   left: -34%;
   right: -34%;
   top: 42%;
   height: 28%;
-  background: linear-gradient(90deg,
-      rgba(44, 175, 194, 0) 0%,
-      rgba(44, 175, 194, 0.16) 22%,
-      rgba(44, 175, 194, 0.2) 55%,
-      rgba(44, 175, 194, 0) 100%);
+  background: linear-gradient(
+    90deg,
+    rgba(44, 175, 194, 0) 0%,
+    rgba(44, 175, 194, 0.16) 22%,
+    rgba(44, 175, 194, 0.2) 55%,
+    rgba(44, 175, 194, 0) 100%
+  );
   /* small blur only — the band keeps its straight parallel edges */
   filter: blur(2px);
   /* 25deg == the roof ridge angle, measured off the artwork itself */
@@ -1183,7 +1241,7 @@
 }
 
 /* the arcs sit in front of the bus, as in the reference */
-.vc-app .about__arcs {
+.vc-app.vc-app .about__arcs {
   position: absolute;
   z-index: 2;
   inset: -12% 12% 2%;
@@ -1192,7 +1250,7 @@
   pointer-events: none;
 }
 
-.vc-app .about__bus {
+.vc-app.vc-app .about__bus {
   position: relative;
   z-index: 1;
   display: grid;
@@ -1200,19 +1258,19 @@
   width: 92%;
 }
 
-.vc-app .about__bus img {
+.vc-app.vc-app .about__bus img {
   width: 100%;
   height: auto;
   object-fit: contain;
   filter: drop-shadow(0 1.5rem 2.5rem rgba(0, 0, 0, 0.25));
 }
 
-.vc-app .about__body {
+.vc-app.vc-app .about__body {
   display: grid;
   gap: clamp(1.25rem, 0.8rem + 1.4vw, 1.8125rem);
 }
 
-.vc-app .about__head {
+.vc-app.vc-app .about__head {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -1220,7 +1278,7 @@
   flex-wrap: wrap;
 }
 
-.vc-app .about__title {
+.vc-app.vc-app .about__title {
   position: relative;
   margin: 0;
   padding-right: 1.5rem;
@@ -1230,33 +1288,33 @@
   opacity: 0.8;
 }
 
-.vc-app .about__chip {
+.vc-app.vc-app .about__chip {
   position: absolute;
   right: 0;
   bottom: -0.75rem;
   transform: rotate(-6deg);
 }
 
-.vc-app .about__text {
+.vc-app.vc-app .about__text {
   margin: 0;
   opacity: 0.7;
   font-weight: 500;
   text-align: justify;
 }
 
-.vc-app .stats {
+.vc-app.vc-app .stats {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--sp-4);
 }
 
-.vc-app .stat {
+.vc-app.vc-app .stat {
   display: flex;
   align-items: flex-end;
   gap: 0.75rem;
 }
 
-.vc-app .stat__num {
+.vc-app.vc-app .stat__num {
   margin: 0;
   font-size: var(--fs-h2);
   font-weight: 800;
@@ -1264,11 +1322,11 @@
   letter-spacing: -0.03em;
 }
 
-.vc-app .stat__num span {
+.vc-app.vc-app .stat__num span {
   color: var(--c-teal);
 }
 
-.vc-app .stat__label {
+.vc-app.vc-app .stat__label {
   opacity: 0.5;
   font-weight: 500;
 }
@@ -1276,7 +1334,7 @@
 /* =========================================================
    Testimonials marquee
    ========================================================= */
-.vc-app .testimonials__head {
+.vc-app.vc-app .testimonials__head {
   display: grid;
   justify-items: center;
   gap: var(--sp-3);
@@ -1284,28 +1342,40 @@
   text-align: center;
 }
 
-.vc-app .testimonials__title {
+.vc-app.vc-app .testimonials__title {
   margin: 0;
   font-size: var(--fs-h2);
   font-weight: 800;
   letter-spacing: -0.03em;
 }
 
-.vc-app .testimonials__lead {
+.vc-app.vc-app .testimonials__lead {
   max-width: 42ch;
   margin: 0;
   opacity: 0.5;
   font-weight: 500;
 }
 
-.vc-app .marquee {
+.vc-app.vc-app .marquee {
   position: relative;
   overflow: hidden;
-  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
-  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
+  -webkit-mask-image: linear-gradient(
+    90deg,
+    transparent,
+    #000 8%,
+    #000 92%,
+    transparent
+  );
+  mask-image: linear-gradient(
+    90deg,
+    transparent,
+    #000 8%,
+    #000 92%,
+    transparent
+  );
 }
 
-.vc-app .marquee__route {
+.vc-app.vc-app .marquee__route {
   position: absolute;
   inset: 0;
   width: 100%;
@@ -1314,7 +1384,7 @@
   pointer-events: none;
 }
 
-.vc-app .marquee__track {
+.vc-app.vc-app .marquee__track {
   display: flex;
   align-items: center;
   gap: var(--gap);
@@ -1323,8 +1393,8 @@
   animation: marquee 60s linear infinite;
 }
 
-.vc-app .marquee:hover .marquee__track,
-.vc-app .marquee:focus-within .marquee__track {
+.vc-app.vc-app .marquee:hover .marquee__track,
+.vc-app.vc-app .marquee:focus-within .marquee__track {
   animation-play-state: paused;
 }
 
@@ -1334,7 +1404,7 @@
   }
 }
 
-.vc-app .quote {
+.vc-app.vc-app .quote {
   display: grid;
   gap: var(--sp-3);
   flex: none;
@@ -1346,39 +1416,39 @@
   backdrop-filter: blur(20px);
 }
 
-.vc-app .quote--lg {
+.vc-app.vc-app .quote--lg {
   width: clamp(19rem, 15rem + 16vw, 32.875rem);
 }
 
-.vc-app .quote--sm {
+.vc-app.vc-app .quote--sm {
   width: clamp(15rem, 12rem + 9vw, 21.375rem);
 }
 
-.vc-app .quote__head {
+.vc-app.vc-app .quote__head {
   display: flex;
   align-items: center;
   gap: 0.75rem;
 }
 
-.vc-app .quote__avatar {
+.vc-app.vc-app .quote__avatar {
   aspect-ratio: 1;
   width: 3rem;
   border-radius: 50%;
   object-fit: cover;
 }
 
-.vc-app .quote__head b {
+.vc-app.vc-app .quote__head b {
   display: block;
   font-weight: 700;
 }
 
-.vc-app .quote__head i {
+.vc-app.vc-app .quote__head i {
   font-style: normal;
   font-weight: 500;
   color: var(--c-teal);
 }
 
-.vc-app .quote blockquote {
+.vc-app.vc-app .quote blockquote {
   opacity: 0.5;
   font-weight: 500;
   text-align: justify;
@@ -1387,7 +1457,7 @@
 /* =========================================================
    Article card
    ========================================================= */
-.vc-app .acard {
+.vc-app.vc-app .acard {
   display: flex;
   flex-direction: column;
   border-radius: var(--r-card);
@@ -1395,15 +1465,15 @@
   transition: transform 0.3s var(--ease);
 }
 
-.vc-app .acard:hover {
+.vc-app.vc-app .acard:hover {
   transform: translateY(-0.25rem);
 }
 
-.vc-app .acard.is-active {
+.vc-app.vc-app .acard.is-active {
   background: var(--c-teal-05);
 }
 
-.vc-app .acard__media {
+.vc-app.vc-app .acard__media {
   position: relative;
   aspect-ratio: 416 / 251;
   border-radius: var(--r-card);
@@ -1412,7 +1482,7 @@
   isolation: isolate;
 }
 
-.vc-app .acard__img {
+.vc-app.vc-app .acard__img {
   position: absolute;
   inset: 0;
   z-index: -2;
@@ -1421,48 +1491,64 @@
   object-fit: cover;
 }
 
-.vc-app .acard__media::after {
+.vc-app.vc-app .acard__media::after {
   content: "";
   position: absolute;
   inset: 0;
   z-index: -1;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.65) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.35) 0%,
+    rgba(0, 0, 0, 0.05) 40%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
-.vc-app .acard.is-active .acard__media::after,
-.vc-app .acard:hover .acard__media::after,
-.vc-app .acard:focus-within .acard__media::after {
+.vc-app.vc-app .acard.is-active .acard__media::after,
+.vc-app.vc-app .acard:hover .acard__media::after,
+.vc-app.vc-app .acard:focus-within .acard__media::after {
   background:
-    radial-gradient(53.59% 137.34% at 50% 46.41%, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%),
+    radial-gradient(
+      53.59% 137.34% at 50% 46.41%,
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 0.4) 100%
+    ),
     linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
     linear-gradient(180deg, rgba(44, 175, 194, 0) 37.33%, #2cafc2 84.53%);
 }
 
-.vc-app .acard.is-active .acard__media,
-.vc-app .acard:hover .acard__media,
-.vc-app .acard:focus-within .acard__media {
+.vc-app.vc-app .acard.is-active .acard__media,
+.vc-app.vc-app .acard:hover .acard__media,
+.vc-app.vc-app .acard:focus-within .acard__media {
   box-shadow: 0 0.75rem 3.75rem 0 rgba(44, 175, 194, 0.5);
 }
 
-.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) {
+.vc-app.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) {
   background: var(--c-white);
 }
 
-.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .acard__media {
+.vc-app.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .acard__media {
   box-shadow: none;
 }
 
-.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .acard__media::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.65) 100%);
+.vc-app.vc-app .rail:hover
+  .acard.is-active:not(:hover):not(:focus-within)
+  .acard__media::after {
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0.35) 0%,
+    rgba(0, 0, 0, 0.05) 40%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
-.vc-app .acard__time {
+.vc-app.vc-app .acard__time {
   position: absolute;
   left: var(--sp-2);
   top: var(--sp-2);
 }
 
-.vc-app .acard__overlay {
+.vc-app.vc-app .acard__overlay {
   position: absolute;
   inset: auto 0 0;
   display: flex;
@@ -1472,7 +1558,7 @@
   padding: clamp(0.875rem, 0.5rem + 1vw, 1.5rem);
 }
 
-.vc-app .acard__title {
+.vc-app.vc-app .acard__title {
   max-width: 17ch;
   margin: 0;
   font-size: var(--fs-card);
@@ -1481,7 +1567,7 @@
   letter-spacing: -0.01em;
 }
 
-.vc-app .acard__excerpt {
+.vc-app.vc-app .acard__excerpt {
   margin: 0;
   padding: var(--sp-4) var(--sp-4) var(--sp-5);
   opacity: 0.7;
@@ -1489,20 +1575,20 @@
   text-align: justify;
 }
 
-.vc-app .acard.is-active .acard__excerpt,
-.vc-app .acard:hover .acard__excerpt,
-.vc-app .acard:focus-within .acard__excerpt {
+.vc-app.vc-app .acard.is-active .acard__excerpt,
+.vc-app.vc-app .acard:hover .acard__excerpt,
+.vc-app.vc-app .acard:focus-within .acard__excerpt {
   opacity: 1;
   color: var(--c-teal);
 }
 
-.vc-app .acard.is-active,
-.vc-app .acard:hover,
-.vc-app .acard:focus-within {
+.vc-app.vc-app .acard.is-active,
+.vc-app.vc-app .acard:hover,
+.vc-app.vc-app .acard:focus-within {
   background: var(--c-teal-05);
 }
 
-.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .acard__excerpt {
+.vc-app.vc-app .rail:hover .acard.is-active:not(:hover):not(:focus-within) .acard__excerpt {
   opacity: 0.7;
   color: inherit;
 }
@@ -1510,7 +1596,7 @@
 /* =========================================================
    FAQ
    ========================================================= */
-.vc-app .faq {
+.vc-app.vc-app .faq {
   position: relative;
   margin: var(--page-inset);
   padding-block: var(--sp-6);
@@ -1520,7 +1606,7 @@
   isolation: isolate;
 }
 
-.vc-app .faq__watermark {
+.vc-app.vc-app .faq__watermark {
   position: absolute;
   left: clamp(1rem, -1rem + 6vw, 4rem);
   bottom: clamp(-2rem, -6vw, -1rem);
@@ -1535,48 +1621,48 @@
   user-select: none;
 }
 
-.vc-app .faq__inner {
+.vc-app.vc-app .faq__inner {
   display: grid;
   grid-template-columns: minmax(0, 0.55fr) minmax(0, 1fr);
   gap: clamp(2rem, 0.5rem + 6vw, 8.375rem);
   align-items: start;
 }
 
-.vc-app .faq__intro {
+.vc-app.vc-app .faq__intro {
   display: grid;
   gap: var(--sp-4);
 }
 
-.vc-app .faq__title {
+.vc-app.vc-app .faq__title {
   margin: 0;
   font-size: var(--fs-h2);
   font-weight: 800;
   letter-spacing: -0.03em;
 }
 
-.vc-app .faq__lead {
+.vc-app.vc-app .faq__lead {
   margin: 0;
   opacity: 0.7;
   font-weight: 500;
 }
 
-.vc-app .accordion {
+.vc-app.vc-app .accordion {
   display: grid;
   gap: var(--sp-4);
 }
 
-.vc-app .acc+.acc {
+.vc-app.vc-app .acc + .acc {
   border-top: 1px solid var(--c-line);
   padding-top: var(--sp-4);
 }
 
-.vc-app .acc h3 {
+.vc-app.vc-app .acc h3 {
   margin: 0;
   font-size: inherit;
   font-weight: inherit;
 }
 
-.vc-app .acc__q {
+.vc-app.vc-app .acc__q {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -1588,46 +1674,49 @@
   transition: color 0.2s var(--ease);
 }
 
-.vc-app .acc__q .icon {
+.vc-app.vc-app .acc__q .icon {
   opacity: 0.3;
 }
 
-.vc-app .acc__minus {
+.vc-app.vc-app .acc__minus {
   display: none;
 }
 
-.vc-app .acc__q[aria-expanded="true"] {
+.vc-app.vc-app .acc__q[aria-expanded="true"] {
   color: var(--c-teal);
   font-weight: 700;
 }
 
-.vc-app .acc__q[aria-expanded="true"] .icon {
+.vc-app.vc-app .acc__q[aria-expanded="true"] .icon {
   opacity: 1;
 }
 
-.vc-app .acc__q[aria-expanded="true"] .acc__plus {
+.vc-app.vc-app .acc__q[aria-expanded="true"] .acc__plus {
   display: none;
 }
 
-.vc-app .acc__q[aria-expanded="true"] .acc__minus {
+.vc-app.vc-app .acc__q[aria-expanded="true"] .acc__minus {
   display: block;
 }
 
-.vc-app .acc__a {
+.vc-app.vc-app .acc__a {
   display: grid;
   grid-template-rows: 0fr;
   transition: grid-template-rows 0.3s var(--ease);
 }
 
-.vc-app .acc__q[aria-expanded="true"]+.acc__a {
+/* The button sits inside an <h3>, so .acc__a is the h3's sibling — not the
+   button's. Match on the .acc wrapper's expanded state instead of an adjacent
+   sibling, which never matched through the heading. */
+.vc-app.vc-app .acc:has(.acc__q[aria-expanded="true"]) .acc__a {
   grid-template-rows: 1fr;
 }
 
-.vc-app .acc__a>* {
+.vc-app.vc-app .acc__a > * {
   overflow: hidden;
 }
 
-.vc-app .acc__a p {
+.vc-app.vc-app .acc__a p {
   margin: 0;
   padding-top: var(--sp-4);
   opacity: 0.7;
@@ -1638,70 +1727,71 @@
 /* =========================================================
    Footer
    ========================================================= */
-.vc-app .footer {
+.vc-app.vc-app .footer {
   position: relative;
-  margin: calc(var(--sp-6) + var(--page-inset)) var(--page-inset) var(--page-inset);
+  margin: calc(var(--sp-6) + var(--page-inset)) var(--page-inset)
+    var(--page-inset);
   padding-block: var(--sp-6) 0;
   border-radius: var(--r-xl);
   color: var(--c-white);
   background: var(--c-black);
 }
 
-.vc-app .footer__inner {
+.vc-app.vc-app .footer__inner {
   display: grid;
   grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
   gap: clamp(2rem, 0.5rem + 5vw, 6rem);
   padding-bottom: var(--sp-6);
 }
 
-.vc-app .footer__logo .logo {
+.vc-app.vc-app .footer__logo .logo {
   width: clamp(5rem, 4rem + 2.5vw, 7.125rem);
   height: auto;
 }
 
-.vc-app .footer__brand {
+.vc-app.vc-app .footer__brand {
   display: grid;
   gap: var(--sp-4);
   align-content: start;
 }
 
-.vc-app .footer__about {
+.vc-app.vc-app .footer__about {
   margin: 0;
   opacity: 0.5;
   font-weight: 500;
   text-align: justify;
 }
 
-.vc-app .footer__cols {
+.vc-app.vc-app .footer__cols {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: var(--sp-4);
   justify-items: start;
 }
 
-.vc-app .footer__cols ul {
+.vc-app.vc-app .footer__cols ul {
   display: grid;
   gap: 0.75rem;
 }
 
-.vc-app .footer__ct {
+.vc-app.vc-app .footer__ct {
   margin: 0 0 var(--sp-3);
   font-size: 1rem;
   font-weight: 700;
   color: var(--c-teal);
 }
 
-.vc-app .footer__cols a {
+.vc-app.vc-app .footer__cols a {
   opacity: 0.5;
   font-weight: 500;
   transition: opacity 0.2s var(--ease);
 }
 
-.vc-app .footer__cols a:hover {
+.vc-app.vc-app .footer__cols a:hover {
   opacity: 1;
 }
 
-.vc-app .footer__bar {
+.vc-app.vc-app .footer__bar {
   display: grid;
   grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, 1fr);
   align-items: center;
@@ -1710,12 +1800,12 @@
   border-top: 1px solid rgba(255, 255, 255, 0.2);
 }
 
-.vc-app .footer__copy {
+.vc-app.vc-app .footer__copy {
   margin: 0;
   font-weight: 500;
 }
 
-.vc-app .socials {
+.vc-app.vc-app .socials {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1723,36 +1813,36 @@
 }
 
 /* dashed rules either side of the social icons, as in the design */
-.vc-app .socials::before,
-.vc-app .socials::after {
+.vc-app.vc-app .socials::before,
+.vc-app.vc-app .socials::after {
   content: "";
   flex: 1 1 clamp(2rem, 8vw, 11rem);
   border-top: 1px dashed rgba(255, 255, 255, 0.3);
 }
 
-.vc-app .socials::before {
+.vc-app.vc-app .socials::before {
   margin-inline-end: var(--sp-4);
 }
 
-.vc-app .socials::after {
+.vc-app.vc-app .socials::after {
   margin-inline-start: var(--sp-4);
 }
 
-.vc-app .socials li {
+.vc-app.vc-app .socials li {
   flex: none;
 }
 
-.vc-app .socials a {
+.vc-app.vc-app .socials a {
   display: grid;
   place-items: center;
   transition: opacity 0.2s var(--ease);
 }
 
-.vc-app .socials a:hover {
+.vc-app.vc-app .socials a:hover {
   opacity: 0.7;
 }
 
-.vc-app .support {
+.vc-app.vc-app .support {
   position: absolute;
   right: clamp(1.5rem, 0.5rem + 3vw, 4rem);
   bottom: 0;
@@ -1762,7 +1852,7 @@
   color: var(--c-white);
 }
 
-.vc-app .support__ring {
+.vc-app.vc-app .support__ring {
   position: absolute;
   aspect-ratio: 1;
   scale: 140%;
@@ -1770,20 +1860,24 @@
   top: -1.5rem;
 }
 
-.vc-app .support__tab {
+.vc-app.vc-app .support__tab {
   display: grid;
   place-items: center;
   padding: var(--sp-4);
   padding-bottom: clamp(2rem, 1rem + 3vw, 3rem);
   border-radius: var(--r-pill) var(--r-pill) 0 0;
-  background: linear-gradient(180deg, rgba(44, 175, 194, 0.99) 0%, var(--c-teal-20) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(44, 175, 194, 0.99) 0%,
+    var(--c-teal-20) 100%
+  );
   box-shadow: 0 0.75rem 8.25rem var(--c-teal);
   -webkit-backdrop-filter: blur(4px);
   backdrop-filter: blur(4px);
   transition: transform 0.2s var(--ease);
 }
 
-.vc-app .support:hover .support__tab {
+.vc-app.vc-app .support:hover .support__tab {
   transform: translateY(-0.25rem);
 }
 
@@ -1791,72 +1885,72 @@
    Responsive
    ========================================================= */
 @media (max-width: 78rem) {
-.vc-app .rail--dest>* {
+.vc-app.vc-app .rail--dest > * {
     flex: 0 0 calc((100% - 3 * var(--gap)) / 4);
   }
 
 }
 
 @media (max-width: 68.75rem) {
-.vc-app .booking__row {
+.vc-app.vc-app .booking__row {
     flex-wrap: wrap;
   }
 
-.vc-app .field {
+.vc-app.vc-app .field {
     flex: 1 1 14rem;
   }
 
-.vc-app .booking__submit {
+.vc-app.vc-app .booking__submit {
     flex: 1 1 100%;
   }
 
-.vc-app .sec-head {
+.vc-app.vc-app .sec-head {
     grid-template-columns: minmax(0, 1fr) auto;
   }
 
-.vc-app .sec-head__lead {
+.vc-app.vc-app .sec-head__lead {
     grid-column: 1 / -1;
     grid-row: 2;
     max-width: none;
   }
 
-.vc-app .rail--dest>* {
+.vc-app.vc-app .rail--dest > * {
     flex: 0 0 calc((100% - 2 * var(--gap)) / 3);
   }
 
-.vc-app .bus {
+.vc-app.vc-app .bus {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .promo {
+.vc-app.vc-app .promo {
     aspect-ratio: 16 / 9;
   }
 
-.vc-app .about {
+.vc-app.vc-app .about {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .about__art {
+.vc-app.vc-app .about__art {
     order: 2;
     aspect-ratio: 16 / 9;
   }
 
-.vc-app .faq__inner {
+.vc-app.vc-app .faq__inner {
     grid-template-columns: minmax(0, 1fr);
   }
 
 }
 
 @media (max-width: 60rem) {
-.vc-app .burger {
+.vc-app.vc-app .burger {
     display: inline-grid;
   }
 
-.vc-app .header__cta {
+.vc-app.vc-app .header__cta {
     display: none;
   }
 
-.vc-app .nav {
+.vc-app.vc-app .nav {
     position: absolute;
     top: calc(100% + var(--sp-2));
     right: var(--gutter);
@@ -1869,34 +1963,37 @@
     opacity: 0;
     visibility: hidden;
     transform: translateY(-0.5rem);
-    transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s;
+    transition:
+      opacity 0.25s var(--ease),
+      transform 0.25s var(--ease),
+      visibility 0.25s;
   }
 
-.vc-app .nav.is-open {
+.vc-app.vc-app .nav.is-open {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
   }
 
-.vc-app .nav__list {
+.vc-app.vc-app .nav__list {
     flex-direction: column;
     align-items: stretch;
     gap: 0;
   }
 
-.vc-app .nav__link {
+.vc-app.vc-app .nav__link {
     width: 100%;
     justify-content: space-between;
     padding: var(--sp-2) var(--sp-3);
     border-radius: var(--r-pill);
   }
 
-.vc-app .nav__link:hover {
+.vc-app.vc-app .nav__link:hover {
     opacity: 1;
     background: rgba(0, 0, 0, 0.05);
   }
 
-.vc-app .nav__submenu {
+.vc-app.vc-app .nav__submenu {
     position: static;
     display: none;
     padding: 0 0 var(--sp-1) var(--sp-3);
@@ -1906,154 +2003,150 @@
     transform: none;
   }
 
-.vc-app .nav__item--has-menu:hover .nav__submenu {
+.vc-app.vc-app .nav__item--has-menu:hover .nav__submenu {
     display: none;
   }
 
-.vc-app .nav__toggle[aria-expanded="true"]+.nav__submenu {
+.vc-app.vc-app .nav__toggle[aria-expanded="true"] + .nav__submenu {
     display: grid;
   }
 
-.vc-app .nav__mobile-cta {
+.vc-app.vc-app .nav__mobile-cta {
     display: block;
     margin-top: var(--sp-1);
   }
 
-.vc-app .nav__cta {
+.vc-app.vc-app .nav__cta {
     width: 100%;
   }
 
-.vc-app .rail--art>* {
+.vc-app.vc-app .rail--art > * {
     flex: 0 0 calc((100% - var(--gap)) / 2);
   }
 
-.vc-app .footer__inner {
+.vc-app.vc-app .footer__inner {
     grid-template-columns: minmax(0, 1fr);
   }
 
 }
 
 @media (max-width: 48rem) {
-.vc-app .rail--dest>* {
+.vc-app.vc-app .rail--dest > * {
     flex: 0 0 calc((100% - var(--gap)) / 2);
   }
 
-.vc-app .bus__grid {
+.vc-app.vc-app .bus__grid {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .stats {
+.vc-app.vc-app .stats {
     gap: var(--sp-3);
   }
 
-.vc-app .footer__bar {
+.vc-app.vc-app .footer__bar {
     grid-template-columns: minmax(0, 1fr);
     justify-items: start;
   }
 
-.vc-app .socials::before,
-.vc-app .socials::after {
+.vc-app.vc-app .socials::before,
+.vc-app.vc-app .socials::after {
     display: none;
   }
 
-.vc-app .support {
+.vc-app.vc-app .support {
     right: var(--gutter);
   }
 
 }
 
 @media (max-width: 40rem) {
-.vc-app .hero {
-    min-height: clamp(30rem, 84svh, 44rem);
-  }
-
-.vc-app .booking {
+.vc-app.vc-app .booking {
     padding: var(--sp-2);
   }
 
-.vc-app .booking__row {
+.vc-app.vc-app .booking__row {
     gap: var(--sp-2);
   }
 
-.vc-app .field {
+.vc-app.vc-app .field {
     flex: 1 1 100%;
   }
 
-.vc-app .sec-head {
+.vc-app.vc-app .sec-head {
     grid-template-columns: minmax(0, 1fr);
     gap: var(--sp-3);
   }
 
-.vc-app .sec-head__lead {
+.vc-app.vc-app .sec-head__lead {
     grid-row: auto;
   }
 
-.vc-app .sec-head__actions {
+.vc-app.vc-app .sec-head__actions {
     flex-direction: row;
     width: 100%;
   }
 
-.vc-app .sec-head__actions .btn--wide {
+.vc-app.vc-app .sec-head__actions .btn--wide {
     width: auto;
     flex: 1 1 auto;
   }
 
-.vc-app .rail--dest>* {
+.vc-app.vc-app .rail--dest > * {
     flex: 0 0 min(72%, 15rem);
   }
 
-.vc-app .rail--art>* {
+.vc-app.vc-app .rail--art > * {
     flex: 0 0 min(85%, 22rem);
   }
 
-.vc-app .promo {
+.vc-app.vc-app .promo {
     aspect-ratio: auto;
     gap: var(--sp-4);
   }
 
-.vc-app .promo__note {
+.vc-app.vc-app .promo__note {
     max-width: none;
     margin-inline-start: 0;
   }
 
-.vc-app .stats {
+.vc-app.vc-app .stats {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .support {
+.vc-app.vc-app .support {
     display: none;
   }
 
-.vc-app .footer__cols {
+.vc-app.vc-app .footer__cols {
     grid-template-columns: repeat(2, minmax(0, 1fr));
     gap: var(--sp-5) var(--sp-4);
   }
 
 /* justified text tears open on narrow columns */
-.vc-app .about__text,
-.vc-app .acard__excerpt,
-.vc-app .quote blockquote,
-.vc-app .acc__a p,
-.vc-app .footer__about {
+.vc-app.vc-app .about__text,
+.vc-app.vc-app .acard__excerpt,
+.vc-app.vc-app .quote blockquote,
+.vc-app.vc-app .acc__a p,
+.vc-app.vc-app .footer__about {
     text-align: left;
   }
 
 }
 
 @media (prefers-reduced-motion: reduce) {
-.vc-app {
+.vc-app.vc-app {
     scroll-behavior: auto;
   }
 
-.vc-app *,
-.vc-app *::before,
-.vc-app *::after {
+.vc-app.vc-app *,
+.vc-app.vc-app *::before,
+.vc-app.vc-app *::after {
     animation-duration: 0.01ms !important;
     animation-iteration-count: 1 !important;
     transition-duration: 0.01ms !important;
   }
 
-.vc-app .rail {
+.vc-app.vc-app .rail {
     scroll-behavior: auto;
   }
 
@@ -2062,16 +2155,16 @@
 /* =========================================================
    Tour archive — hero filter bar
    ========================================================= */
-.vc-app .hero--archive {
+.vc-app.vc-app .hero--archive {
   min-height: clamp(30rem, 78svh, 48rem);
 }
 
 /* "Explore Tours" is short enough to stay on one line at every size */
-.vc-app .hero--archive .hero__title {
+.vc-app.vc-app .hero--archive .hero__title {
   max-width: none;
 }
 
-.vc-app .filters {
+.vc-app.vc-app .filters {
   order: 3;
   width: 100%;
   border-radius: var(--r-card);
@@ -2079,15 +2172,15 @@
   box-shadow: 0 1.5rem 3.5rem rgba(0, 0, 0, 0.18);
 }
 
-.vc-app .filters__row {
+.vc-app.vc-app .filters__row {
   display: flex;
   align-items: center;
   gap: var(--sp-3);
   padding: var(--sp-3);
 }
 
-.vc-app .fsearch,
-.vc-app .fsel {
+.vc-app.vc-app .fsearch,
+.vc-app.vc-app .fsel {
   position: relative;
   display: flex;
   flex: 1 1 0;
@@ -2099,38 +2192,38 @@
 }
 
 /* the search field carries the longest placeholder, so it takes a little more room */
-.vc-app .fsearch {
+.vc-app.vc-app .fsearch {
   flex-grow: 1.3;
   border: 1px solid var(--c-white);
   background: rgba(0, 0, 0, 0.05);
 }
 
-.vc-app .fsel {
+.vc-app.vc-app .fsel {
   border: 1px solid var(--c-line);
   background: var(--c-white);
 }
 
-.vc-app .fsel:hover {
+.vc-app.vc-app .fsel:hover {
   border-color: rgba(0, 0, 0, 0.3);
 }
 
-.vc-app .fsearch__icon,
-.vc-app .fsel__icon {
+.vc-app.vc-app .fsearch__icon,
+.vc-app.vc-app .fsel__icon {
   position: absolute;
   left: var(--sp-3);
   pointer-events: none;
   color: var(--c-black);
 }
 
-.vc-app .fsel__chevron {
+.vc-app.vc-app .fsel__chevron {
   position: absolute;
   right: var(--sp-3);
   pointer-events: none;
   color: var(--c-black);
 }
 
-.vc-app .fsearch__input,
-.vc-app .fsel__input {
+.vc-app.vc-app .fsearch__input,
+.vc-app.vc-app .fsel__input {
   width: 100%;
   min-width: 0;
   min-height: var(--control-h);
@@ -2146,31 +2239,31 @@
   text-overflow: ellipsis;
 }
 
-.vc-app .fsearch__input {
+.vc-app.vc-app .fsearch__input {
   padding-inline: calc(var(--sp-3) + 1.375rem) var(--sp-2);
   font-size: 0.875rem;
 }
 
-.vc-app .fsearch__input::placeholder {
+.vc-app.vc-app .fsearch__input::placeholder {
   color: var(--c-black);
   opacity: 0.5;
 }
 
-.vc-app .fsearch__input::-webkit-search-cancel-button,
-.vc-app .fsearch__input::-webkit-search-decoration {
+.vc-app.vc-app .fsearch__input::-webkit-search-cancel-button,
+.vc-app.vc-app .fsearch__input::-webkit-search-decoration {
   -webkit-appearance: none;
 }
 
 /* the sort dropdown carries its label outside the pill, so it needs no lead icon */
-.vc-app .fsel--bare .fsel__input {
+.vc-app.vc-app .fsel--bare .fsel__input {
   padding-left: var(--sp-3);
 }
 
-.vc-app .filters__apply {
+.vc-app.vc-app .filters__apply {
   flex: none;
 }
 
-.vc-app .filters__bar {
+.vc-app.vc-app .filters__bar {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -2180,21 +2273,21 @@
   border-top: 1px solid var(--c-line);
 }
 
-.vc-app .filters__checks {
+.vc-app.vc-app .filters__checks {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: var(--sp-2) 2.5rem;
 }
 
-.vc-app .check {
+.vc-app.vc-app .check {
   display: inline-flex;
   align-items: center;
   gap: var(--sp-1);
   cursor: pointer;
 }
 
-.vc-app .check__input {
+.vc-app.vc-app .check__input {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -2202,7 +2295,7 @@
   pointer-events: none;
 }
 
-.vc-app .check__box {
+.vc-app.vc-app .check__box {
   display: grid;
   flex: none;
   place-items: center;
@@ -2212,42 +2305,45 @@
   border-radius: 0.25rem;
   color: transparent;
   background: var(--c-white);
-  transition: color 0.2s var(--ease), background-color 0.2s var(--ease), border-color 0.2s var(--ease);
+  transition:
+    color 0.2s var(--ease),
+    background-color 0.2s var(--ease),
+    border-color 0.2s var(--ease);
 }
 
-.vc-app .check:hover .check__box {
+.vc-app.vc-app .check:hover .check__box {
   border-color: rgba(0, 0, 0, 0.45);
 }
 
-.vc-app .check__input:checked+.check__box {
+.vc-app.vc-app .check__input:checked + .check__box {
   color: var(--c-white);
   border-color: var(--c-black);
   background: var(--c-black);
 }
 
-.vc-app .check__input:focus-visible+.check__box {
+.vc-app.vc-app .check__input:focus-visible + .check__box {
   outline: 2px solid var(--c-teal);
   outline-offset: 2px;
 }
 
-.vc-app .check__text {
+.vc-app.vc-app .check__text {
   font-size: 1rem;
   font-weight: 500;
   opacity: 0.7;
   transition: opacity 0.2s var(--ease);
 }
 
-.vc-app .check__input:checked~.check__text {
+.vc-app.vc-app .check__input:checked ~ .check__text {
   opacity: 1;
 }
 
-.vc-app .filters__sort {
+.vc-app.vc-app .filters__sort {
   display: flex;
   align-items: center;
   gap: var(--sp-2);
 }
 
-.vc-app .filters__sort-label {
+.vc-app.vc-app .filters__sort-label {
   display: inline-flex;
   align-items: center;
   gap: var(--sp-1);
@@ -2256,11 +2352,11 @@
   white-space: nowrap;
 }
 
-.vc-app .filters__sort-label label {
+.vc-app.vc-app .filters__sort-label label {
   cursor: pointer;
 }
 
-.vc-app .filters__sort .fsel {
+.vc-app.vc-app .filters__sort .fsel {
   flex: none;
   width: 8.8125rem;
 }
@@ -2270,11 +2366,11 @@
    ========================================================= */
 /* the script shows and hides cards, pages and buttons with the hidden
    attribute, which the flex and grid display values would otherwise win against */
-.vc-app [hidden] {
+.vc-app.vc-app [hidden] {
   display: none !important;
 }
 
-.vc-app .results {
+.vc-app.vc-app .results {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -2283,22 +2379,22 @@
   margin-block-end: var(--sp-4);
 }
 
-.vc-app .results__count {
+.vc-app.vc-app .results__count {
   margin: 0;
   font-size: 1rem;
   font-weight: 500;
   opacity: 0.7;
 }
 
-.vc-app .results__count b {
+.vc-app.vc-app .results__count b {
   font-weight: 800;
 }
 
-.vc-app .results__reset {
+.vc-app.vc-app .results__reset {
   flex: none;
 }
 
-.vc-app .tgrid__empty {
+.vc-app.vc-app .tgrid__empty {
   margin: 0;
   padding-block: var(--sp-5);
   font-size: 1.125rem;
@@ -2308,7 +2404,7 @@
 }
 
 /* a button that reads as part of the sentence around it */
-.vc-app .linkbtn {
+.vc-app.vc-app .linkbtn {
   padding: 0;
   border: 0;
   font: inherit;
@@ -2318,7 +2414,7 @@
   cursor: pointer;
 }
 
-.vc-app .tgrid {
+.vc-app.vc-app .tgrid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 2.5rem var(--gap);
@@ -2327,7 +2423,7 @@
   list-style: none;
 }
 
-.vc-app .titem {
+.vc-app.vc-app .titem {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -2335,21 +2431,21 @@
 }
 
 /* landscape variant of the destination card used on the homepage rail */
-.vc-app .dcard--wide {
+.vc-app.vc-app .dcard--wide {
   width: 100%;
   aspect-ratio: 416 / 251;
 }
 
 /* the wider card gives the title and the key/value pairs more room to breathe */
-.vc-app .dcard--wide .dcard__body {
+.vc-app.vc-app .dcard--wide .dcard__body {
   gap: var(--sp-3);
 }
 
-.vc-app .dcard--wide .dcard__meta {
+.vc-app.vc-app .dcard--wide .dcard__meta {
   gap: var(--sp-4);
 }
 
-.vc-app .titem__desc {
+.vc-app.vc-app .titem__desc {
   width: 88.5%;
   margin: 0;
   font-size: 1rem;
@@ -2357,35 +2453,45 @@
   line-height: 1.5;
   text-align: justify;
   opacity: 0.7;
-  transition: color 0.25s var(--ease), opacity 0.25s var(--ease);
+  transition:
+    color 0.25s var(--ease),
+    opacity 0.25s var(--ease);
 }
 
-.vc-app .titem.is-active .titem__desc,
-.vc-app .titem:hover .titem__desc,
-.vc-app .titem:focus-within .titem__desc {
+.vc-app.vc-app .titem.is-active .titem__desc,
+.vc-app.vc-app .titem:hover .titem__desc,
+.vc-app.vc-app .titem:focus-within .titem__desc {
   color: var(--c-teal);
   opacity: 1;
 }
 
 /* hovering any card in the grid hands the highlight over to it */
-.vc-app .tgrid:hover .titem.is-active:not(:hover):not(:focus-within) .titem__desc,
-.vc-app .tgrid:focus-within .titem.is-active:not(:hover):not(:focus-within) .titem__desc {
+.vc-app.vc-app .tgrid:hover .titem.is-active:not(:hover):not(:focus-within) .titem__desc,
+.vc-app.vc-app .tgrid:focus-within
+  .titem.is-active:not(:hover):not(:focus-within)
+  .titem__desc {
   color: inherit;
   opacity: 0.7;
 }
 
-.vc-app .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within),
-.vc-app .tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within) {
+.vc-app.vc-app .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within),
+.vc-app.vc-app .tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within) {
   box-shadow: none;
 }
 
-.vc-app .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within)::after,
-.vc-app .tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within)::after {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.65) 100%);
+.vc-app.vc-app .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within)::after,
+.vc-app.vc-app .tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within)::after {
+  background: linear-gradient(
+    180deg,
+    rgba(0, 0, 0, 0) 35%,
+    rgba(0, 0, 0, 0.65) 100%
+  );
 }
 
-.vc-app .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
-.vc-app .tgrid:focus-within .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot {
+.vc-app.vc-app .tgrid:hover .dcard.is-active:not(:hover):not(:focus-within) .ring-badge__dot,
+.vc-app.vc-app .tgrid:focus-within
+  .dcard.is-active:not(:hover):not(:focus-within)
+  .ring-badge__dot {
   color: var(--c-white);
   background: var(--c-glass);
 }
@@ -2393,7 +2499,7 @@
 /* =========================================================
    Tour archive — pagination
    ========================================================= */
-.vc-app .pager {
+.vc-app.vc-app .pager {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -2402,14 +2508,14 @@
   margin-block-start: var(--sp-6);
 }
 
-.vc-app .pager__pages {
+.vc-app.vc-app .pager__pages {
   display: flex;
   align-items: center;
   gap: var(--sp-1);
 }
 
-.vc-app .pager__num,
-.vc-app .pager__btn {
+.vc-app.vc-app .pager__num,
+.vc-app.vc-app .pager__btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -2423,42 +2529,45 @@
   color: var(--c-black);
   background: transparent;
   cursor: pointer;
-  transition: color 0.2s var(--ease), background-color 0.2s var(--ease), border-color 0.2s var(--ease);
+  transition:
+    color 0.2s var(--ease),
+    background-color 0.2s var(--ease),
+    border-color 0.2s var(--ease);
 }
 
-.vc-app .pager__num {
+.vc-app.vc-app .pager__num {
   min-width: var(--control-h);
   padding: 0 var(--sp-1);
 }
 
-.vc-app .pager__num:hover {
+.vc-app.vc-app .pager__num:hover {
   background: rgba(0, 0, 0, 0.05);
 }
 
-.vc-app .pager__num.is-current {
+.vc-app.vc-app .pager__num.is-current {
   color: var(--c-white);
   background: var(--c-black);
 }
 
-.vc-app .pager__btn {
+.vc-app.vc-app .pager__btn {
   border: 1px solid var(--c-line);
   background: var(--c-white);
 }
 
-.vc-app .pager__btn--icon {
+.vc-app.vc-app .pager__btn--icon {
   min-width: 4.5rem;
 }
 
-.vc-app .pager__btn:hover:not([disabled]) {
+.vc-app.vc-app .pager__btn:hover:not([disabled]) {
   border-color: var(--c-black);
 }
 
-.vc-app .pager__btn[disabled] {
+.vc-app.vc-app .pager__btn[disabled] {
   opacity: 0.4;
   cursor: not-allowed;
 }
 
-.vc-app .pager__gap {
+.vc-app.vc-app .pager__gap {
   padding-inline: 0.25rem;
   font-weight: 500;
   opacity: 0.5;
@@ -2468,66 +2577,66 @@
    Tour archive — responsive
    ========================================================= */
 @media (max-width: 68.75rem) {
-.vc-app .filters__row {
+.vc-app.vc-app .filters__row {
     flex-wrap: wrap;
   }
 
-.vc-app .fsearch,
-.vc-app .fsel {
+.vc-app.vc-app .fsearch,
+.vc-app.vc-app .fsel {
     flex: 1 1 12rem;
   }
 
-.vc-app .filters__apply {
+.vc-app.vc-app .filters__apply {
     flex: 1 1 100%;
   }
 
-.vc-app .tgrid {
+.vc-app.vc-app .tgrid {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 
 }
 
 @media (max-width: 48rem) {
-.vc-app .filters__bar {
+.vc-app.vc-app .filters__bar {
     justify-content: flex-start;
   }
 
-.vc-app .filters__checks {
+.vc-app.vc-app .filters__checks {
     gap: var(--sp-2) var(--sp-5);
   }
 
 }
 
 @media (max-width: 40rem) {
-.vc-app .filters__row {
+.vc-app.vc-app .filters__row {
     gap: var(--sp-2);
     padding: var(--sp-2);
   }
 
-.vc-app .fsearch,
-.vc-app .fsel {
+.vc-app.vc-app .fsearch,
+.vc-app.vc-app .fsel {
     flex: 1 1 100%;
   }
 
-.vc-app .filters__bar {
+.vc-app.vc-app .filters__bar {
     padding: var(--sp-3);
   }
 
-.vc-app .filters__sort {
+.vc-app.vc-app .filters__sort {
     width: 100%;
     justify-content: space-between;
   }
 
-.vc-app .tgrid {
+.vc-app.vc-app .tgrid {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .titem__desc {
+.vc-app.vc-app .titem__desc {
     width: 100%;
     text-align: left;
   }
 
-.vc-app .pager__btn--icon {
+.vc-app.vc-app .pager__btn--icon {
     min-width: 0;
   }
 
@@ -2536,7 +2645,7 @@
 /* =========================================================
    Tour details — hero
    ========================================================= */
-.vc-app .hero-tour {
+.vc-app.vc-app .hero-tour {
   position: relative;
   display: grid;
   align-items: end;
@@ -2545,7 +2654,8 @@
   --word: clamp(3rem, 0.4rem + 9.5vw, 11.25rem);
   min-height: clamp(26rem, 62svh, 38rem);
   margin: var(--page-inset);
-  padding-block: calc(var(--header-h) + var(--sp-5)) clamp(0.75rem, 0.4rem + 1vw, 1.5rem);
+  padding-block: calc(var(--header-h) + var(--sp-5))
+    clamp(0.75rem, 0.4rem + 1vw, 1.5rem);
   border-radius: var(--r-xl);
   isolation: isolate;
   overflow: clip;
@@ -2553,7 +2663,7 @@
 
 /* the sky photo is framed on its upper third so the grass at its foot stays out
    of shot, and the wash over it carries the blue into the brand turquoise */
-.vc-app .hero-tour__photo {
+.vc-app.vc-app .hero-tour__photo {
   position: absolute;
   inset: 0;
   z-index: -2;
@@ -2562,19 +2672,35 @@
   border-radius: inherit;
   object-fit: cover;
   object-position: center 26%;
+  /* Viator only ships ~720px images, which look soft blown up to a full-width
+     banner. Rather than fight it, lean in: a gentle blur turns the photo into an
+     intentional backdrop (the crisp image lives in the gallery lightbox). The
+     scale hides the blur's feathered edges, which overflow:clip on .hero-tour
+     then trims to the rounded frame. */
+  filter: blur(10px) saturate(1.12);
+  transform: scale(1.12);
 }
 
-.vc-app .hero-tour__sky {
+.vc-app.vc-app .hero-tour__sky {
   position: absolute;
   inset: 0;
   z-index: -1;
   border-radius: inherit;
   background:
-    radial-gradient(70% 50% at 50% 100%, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 70%),
-    linear-gradient(180deg, rgba(27, 147, 166, 0.82) 0%, rgba(44, 175, 194, 0.62) 45%, rgba(111, 208, 221, 0.78) 100%);
+    radial-gradient(
+      70% 50% at 50% 100%,
+      rgba(255, 255, 255, 0.3) 0%,
+      rgba(255, 255, 255, 0) 70%
+    ),
+    linear-gradient(
+      180deg,
+      rgba(27, 147, 166, 0.55) 0%,
+      rgba(44, 175, 194, 0.42) 45%,
+      rgba(111, 208, 221, 0.72) 100%
+    );
 }
 
-.vc-app .hero-tour__inner {
+.vc-app.vc-app .hero-tour__inner {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -2582,7 +2708,7 @@
 
 /* the block is exactly as wide as the display word, so it can sit centred in
    the hero while the breadcrumb and the kicker line up on the word's left edge */
-.vc-app .hero-tour__block {
+.vc-app.vc-app .hero-tour__block {
   display: flex;
   position: absolute;
   top: 112px;
@@ -2593,7 +2719,7 @@
   max-width: 100%;
 }
 
-.vc-app .crumbs__list {
+.vc-app.vc-app .crumbs__list {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
@@ -2605,22 +2731,22 @@
   font-weight: 500;
 }
 
-.vc-app .crumbs__list li+li::before {
+.vc-app.vc-app .crumbs__list li + li::before {
   content: "/";
   margin-inline-end: var(--sp-1);
   opacity: 0.5;
 }
 
-.vc-app .crumbs__list a {
+.vc-app.vc-app .crumbs__list a {
   opacity: 0.5;
   transition: opacity 0.2s var(--ease);
 }
 
-.vc-app .crumbs__list a:hover {
+.vc-app.vc-app .crumbs__list a:hover {
   opacity: 1;
 }
 
-.vc-app .hero-tour__kicker {
+.vc-app.vc-app .hero-tour__kicker {
   margin: 0;
   font-size: max(1.25rem, calc(var(--word) * 0.222));
   font-weight: 500;
@@ -2631,14 +2757,14 @@
    children are measured in em against it - the offsets are the Figma ones
    (word at x487/y193 at 180px, figure at x756/y58, 263x447) expressed as ratios,
    which keeps the composition identical at every width. */
-.vc-app .hero-tour__stage {
+.vc-app.vc-app .hero-tour__stage {
   position: relative;
   align-self: stretch;
   font-size: var(--word);
   isolation: isolate;
 }
 
-.vc-app .hero-tour__word {
+.vc-app.vc-app .hero-tour__word {
   margin: 0;
   font-size: 1em;
   font-weight: 500;
@@ -2647,7 +2773,7 @@
   color: var(--c-white);
 }
 
-.vc-app .hero-tour__figure {
+.vc-app.vc-app .hero-tour__figure {
   position: absolute;
   left: 2em;
   top: -0.5em;
@@ -2661,33 +2787,33 @@
 /* =========================================================
    Tour details — layout
    ========================================================= */
-.vc-app .tour__layout {
+.vc-app.vc-app .tour__layout {
   display: grid;
   grid-template-columns: minmax(0, 1fr) 26rem;
   align-items: start;
   gap: clamp(1.5rem, 1rem + 1vw, 2rem);
 }
 
-.vc-app .tour__main {
+.vc-app.vc-app .tour__main {
   display: flex;
   flex-direction: column;
   gap: var(--sp-5);
   min-width: 0;
 }
 
-.vc-app .tour__block {
+.vc-app.vc-app .tour__block {
   display: flex;
   flex-direction: column;
   gap: var(--sp-1);
 }
 
-.vc-app .tour__ct {
+.vc-app.vc-app .tour__ct {
   margin: 0;
   font-size: 1rem;
   font-weight: 700;
 }
 
-.vc-app .tour__text {
+.vc-app.vc-app .tour__text {
   margin: 0;
   font-size: 1rem;
   font-weight: 500;
@@ -2696,12 +2822,12 @@
   opacity: 0.7;
 }
 
-.vc-app .tour__text+.tour__text {
+.vc-app.vc-app .tour__text + .tour__text {
   margin-block-start: var(--sp-3);
 }
 
 /* --- title row --- */
-.vc-app .tour-head {
+.vc-app.vc-app .tour-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -2709,14 +2835,14 @@
   gap: var(--sp-3) var(--sp-4);
 }
 
-.vc-app .tour-head__title {
+.vc-app.vc-app .tour-head__title {
   margin: 0;
   font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.5rem);
   font-weight: 500;
   letter-spacing: -0.01em;
 }
 
-.vc-app .tmeta {
+.vc-app.vc-app .tmeta {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
@@ -2725,38 +2851,38 @@
   font-weight: 500;
 }
 
-.vc-app .tmeta__item {
+.vc-app.vc-app .tmeta__item {
   display: inline-flex;
   align-items: center;
   gap: var(--sp-1);
 }
 
-.vc-app .tmeta__item b {
+.vc-app.vc-app .tmeta__item b {
   font-weight: 500;
 }
 
-.vc-app .tmeta__item i {
+.vc-app.vc-app .tmeta__item i {
   font-size: 0.75rem;
   font-style: normal;
   opacity: 0.3;
 }
 
-.vc-app .tmeta__star {
+.vc-app.vc-app .tmeta__star {
   color: var(--c-accent);
 }
 
-.vc-app .tmeta__icon {
+.vc-app.vc-app .tmeta__icon {
   opacity: 0.5;
 }
 
-.vc-app .tmeta__rule {
+.vc-app.vc-app .tmeta__rule {
   width: 1px;
   height: 1.5rem;
   background: var(--c-line);
 }
 
 /* --- the four facts under the title --- */
-.vc-app .facts {
+.vc-app.vc-app .facts {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: var(--sp-1);
@@ -2765,8 +2891,8 @@
   list-style: none;
 }
 
-.vc-app .fact,
-.vc-app .note {
+.vc-app.vc-app .fact,
+.vc-app.vc-app .note {
   display: flex;
   align-items: center;
   gap: var(--sp-2);
@@ -2775,41 +2901,41 @@
   background: var(--c-teal-05);
 }
 
-.vc-app .fact {
+.vc-app.vc-app .fact {
   padding: var(--sp-4) var(--sp-3);
 }
 
-.vc-app .fact__icon,
-.vc-app .note__icon {
+.vc-app.vc-app .fact__icon,
+.vc-app.vc-app .note__icon {
   flex: none;
   color: var(--c-teal);
 }
 
-.vc-app .fact__text {
+.vc-app.vc-app .fact__text {
   display: flex;
   flex-direction: column;
   min-width: 0;
 }
 
-.vc-app .fact__k {
+.vc-app.vc-app .fact__k {
   font-size: 0.75rem;
   font-weight: 500;
   color: var(--c-teal);
 }
 
-.vc-app .fact__v {
+.vc-app.vc-app .fact__v {
   font-size: 1rem;
   font-weight: 500;
 }
 
 /* --- gallery --- */
-.vc-app .gallery {
+.vc-app.vc-app .gallery {
   display: grid;
   grid-template-columns: 350fr 245fr 245fr;
   gap: var(--sp-3);
 }
 
-.vc-app .gallery img {
+.vc-app.vc-app .gallery img {
   width: 100%;
   height: 100%;
   aspect-ratio: 245 / 194;
@@ -2817,26 +2943,139 @@
   object-fit: cover;
 }
 
-.vc-app .gallery__hero {
+.vc-app.vc-app .gallery__hero {
   grid-row: span 2;
   aspect-ratio: auto;
   border-radius: var(--r-card);
 }
 
+.vc-app.vc-app .gallery img {
+  cursor: zoom-in;
+  transition: transform 0.25s var(--ease), filter 0.25s var(--ease);
+}
+
+.vc-app.vc-app .gallery img:hover {
+  filter: brightness(1.05);
+}
+
+/* =========================================================
+   Gallery lightbox (built by vc-design.js)
+   ========================================================= */
+.vc-app.vc-app .vc-lightbox {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  display: grid;
+  place-items: center;
+  padding: clamp(1rem, 0.5rem + 3vw, 3.5rem);
+  background: rgba(0, 0, 0, 0.86);
+  -webkit-backdrop-filter: blur(6px);
+  backdrop-filter: blur(6px);
+  opacity: 0;
+  visibility: hidden;
+  transition:
+    opacity 0.25s var(--ease),
+    visibility 0s linear 0.25s;
+}
+
+.vc-app.vc-app .vc-lightbox.is-open {
+  opacity: 1;
+  visibility: visible;
+  transition: opacity 0.25s var(--ease);
+}
+
+.vc-app.vc-app .vc-lightbox__img {
+  max-width: min(100%, 78rem);
+  max-height: 84vh;
+  width: auto;
+  height: auto;
+  border-radius: var(--r-card);
+  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.5);
+  transform: scale(0.96);
+  transition: transform 0.25s var(--ease), opacity 0.15s var(--ease);
+}
+
+.vc-app.vc-app .vc-lightbox.is-open .vc-lightbox__img {
+  transform: scale(1);
+}
+
+.vc-app.vc-app .vc-lightbox__btn {
+  position: absolute;
+  display: grid;
+  place-items: center;
+  width: 3rem;
+  height: 3rem;
+  padding: 0;
+  border: 0;
+  border-radius: var(--r-pill);
+  color: var(--c-white);
+  background: rgba(255, 255, 255, 0.12);
+  -webkit-backdrop-filter: blur(8px);
+  backdrop-filter: blur(8px);
+  cursor: pointer;
+  transition: background 0.2s var(--ease), transform 0.2s var(--ease);
+}
+
+.vc-app.vc-app .vc-lightbox__btn:hover {
+  background: rgba(255, 255, 255, 0.24);
+}
+
+.vc-app.vc-app .vc-lightbox__close {
+  top: clamp(1rem, 3vw, 2rem);
+  right: clamp(1rem, 3vw, 2rem);
+}
+
+.vc-app.vc-app .vc-lightbox__prev,
+.vc-app.vc-app .vc-lightbox__next {
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.vc-app.vc-app .vc-lightbox__prev {
+  left: clamp(0.5rem, 2vw, 2rem);
+}
+
+.vc-app.vc-app .vc-lightbox__next {
+  right: clamp(0.5rem, 2vw, 2rem);
+}
+
+.vc-app.vc-app .vc-lightbox__prev:hover,
+.vc-app.vc-app .vc-lightbox__next:hover {
+  transform: translateY(-50%) scale(1.06);
+}
+
+.vc-app.vc-app .vc-lightbox__count {
+  position: absolute;
+  bottom: clamp(1rem, 3vw, 2rem);
+  left: 50%;
+  transform: translateX(-50%);
+  color: rgba(255, 255, 255, 0.85);
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+}
+
+/* single image → hide the arrows */
+.vc-app.vc-app .vc-lightbox--single .vc-lightbox__prev,
+.vc-app.vc-app .vc-lightbox--single .vc-lightbox__next,
+.vc-app.vc-app .vc-lightbox--single .vc-lightbox__count {
+  display: none;
+}
+
 /* --- included / not included --- */
-.vc-app .lists {
+.vc-app.vc-app .lists {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--sp-4) clamp(1.5rem, 1rem + 1.5vw, 1.6875rem);
 }
 
-.vc-app .ilist {
+.vc-app.vc-app .ilist {
   display: flex;
   flex-direction: column;
   gap: var(--sp-3);
 }
 
-.vc-app .ilist__items {
+.vc-app.vc-app .ilist__items {
   display: flex;
   flex-direction: column;
   gap: var(--sp-3);
@@ -2845,13 +3084,13 @@
   list-style: none;
 }
 
-.vc-app .ilist__items li {
+.vc-app.vc-app .ilist__items li {
   display: flex;
   align-items: center;
   gap: var(--sp-3);
 }
 
-.vc-app .ilist__items p {
+.vc-app.vc-app .ilist__items p {
   margin: 0;
   font-size: 1rem;
   font-weight: 500;
@@ -2860,7 +3099,7 @@
   opacity: 0.7;
 }
 
-.vc-app .tick {
+.vc-app.vc-app .tick {
   display: grid;
   flex: none;
   place-items: center;
@@ -2869,18 +3108,18 @@
   border-radius: var(--r-pill);
 }
 
-.vc-app .tick--yes {
+.vc-app.vc-app .tick--yes {
   color: var(--c-green);
   background: rgba(52, 199, 89, 0.1);
 }
 
-.vc-app .tick--no {
+.vc-app.vc-app .tick--no {
   color: var(--c-red);
   background: rgba(255, 56, 60, 0.1);
 }
 
 /* --- good to know --- */
-.vc-app .notes {
+.vc-app.vc-app .notes {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: var(--sp-1);
@@ -2889,12 +3128,12 @@
   list-style: none;
 }
 
-.vc-app .note {
+.vc-app.vc-app .note {
   gap: var(--sp-2);
   padding: var(--sp-4) var(--sp-3);
 }
 
-.vc-app .note p {
+.vc-app.vc-app .note p {
   margin: 0;
   font-size: 1rem;
   font-weight: 500;
@@ -2902,7 +3141,7 @@
 }
 
 /* --- the tinted key/value cards, shared by the policy row and the sidebar --- */
-.vc-app .statcard {
+.vc-app.vc-app .statcard {
   display: flex;
   align-items: center;
   gap: var(--sp-2);
@@ -2910,54 +3149,54 @@
   border-radius: var(--r-card);
 }
 
-.vc-app .statcard__icon {
+.vc-app.vc-app .statcard__icon {
   flex: none;
 }
 
-.vc-app .statcard__text {
+.vc-app.vc-app .statcard__text {
   display: flex;
   flex-direction: column;
   min-width: 0;
 }
 
-.vc-app .statcard__k {
+.vc-app.vc-app .statcard__k {
   font-size: 0.75rem;
   font-weight: 500;
 }
 
-.vc-app .statcard__v {
+.vc-app.vc-app .statcard__v {
   font-size: 1rem;
   font-weight: 500;
 }
 
-.vc-app .statcard--yes {
+.vc-app.vc-app .statcard--yes {
   background: rgba(52, 199, 89, 0.05);
 }
 
-.vc-app .statcard--yes .statcard__icon,
-.vc-app .statcard--yes .statcard__k {
+.vc-app.vc-app .statcard--yes .statcard__icon,
+.vc-app.vc-app .statcard--yes .statcard__k {
   color: var(--c-green);
 }
 
-.vc-app .statcard--no {
+.vc-app.vc-app .statcard--no {
   background: rgba(255, 56, 60, 0.05);
 }
 
-.vc-app .statcard--no .statcard__icon,
-.vc-app .statcard--no .statcard__k {
+.vc-app.vc-app .statcard--no .statcard__icon,
+.vc-app.vc-app .statcard--no .statcard__k {
   color: var(--c-red);
 }
 
-.vc-app .statcard--teal {
+.vc-app.vc-app .statcard--teal {
   background: var(--c-teal-05);
 }
 
-.vc-app .statcard--teal .statcard__icon,
-.vc-app .statcard--teal .statcard__k {
+.vc-app.vc-app .statcard--teal .statcard__icon,
+.vc-app.vc-app .statcard--teal .statcard__k {
   color: var(--c-teal);
 }
 
-.vc-app .policy {
+.vc-app.vc-app .policy {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--sp-3);
@@ -2967,12 +3206,12 @@
 /* =========================================================
    Tour details — booking sidebar
    ========================================================= */
-.vc-app .tour__aside {
+.vc-app.vc-app .tour__aside {
   position: sticky;
   top: calc(var(--header-h) + var(--sp-3));
 }
 
-.vc-app .bookcard {
+.vc-app.vc-app .bookcard {
   display: flex;
   flex-direction: column;
   gap: var(--sp-1);
@@ -2982,7 +3221,7 @@
   background: var(--c-white);
 }
 
-.vc-app .bookcard__title {
+.vc-app.vc-app .bookcard__title {
   display: flex;
   align-items: center;
   gap: var(--sp-1);
@@ -2992,7 +3231,7 @@
   font-weight: 500;
 }
 
-.vc-app .bookcard__price {
+.vc-app.vc-app .bookcard__price {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -3003,7 +3242,7 @@
   border-radius: var(--r-card);
 }
 
-.vc-app .price {
+.vc-app.vc-app .price {
   display: grid;
   grid-template-areas:
     "k k"
@@ -3013,28 +3252,28 @@
   margin: 0;
 }
 
-.vc-app .price__k {
+.vc-app.vc-app .price__k {
   grid-area: k;
   font-size: 0.75rem;
   font-weight: 500;
   opacity: 0.3;
 }
 
-.vc-app .price__v {
+.vc-app.vc-app .price__v {
   grid-area: v;
   font-size: 2rem;
   font-weight: 500;
   letter-spacing: -0.01em;
 }
 
-.vc-app .price__unit {
+.vc-app.vc-app .price__unit {
   grid-area: u;
   font-size: 0.75rem;
   font-weight: 500;
   opacity: 0.3;
 }
 
-.vc-app .bookcard__cta {
+.vc-app.vc-app .bookcard__cta {
   flex: none;
 }
 
@@ -3042,72 +3281,72 @@
    Tour details — responsive
    ========================================================= */
 @media (max-width: 68.75rem) {
-.vc-app .tour__layout {
+.vc-app.vc-app .tour__layout {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .tour__aside {
+.vc-app.vc-app .tour__aside {
     position: static;
     order: -1;
   }
 
-.vc-app .facts {
+.vc-app.vc-app .facts {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 
-.vc-app .notes {
+.vc-app.vc-app .notes {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 
 }
 
 @media (max-width: 48rem) {
-.vc-app .gallery {
+.vc-app.vc-app .gallery {
     grid-template-columns: repeat(2, minmax(0, 1fr));
     grid-template-rows: auto;
     aspect-ratio: auto;
   }
 
-.vc-app .gallery img {
+.vc-app.vc-app .gallery img {
     aspect-ratio: 4 / 3;
   }
 
-.vc-app .gallery__hero {
+.vc-app.vc-app .gallery__hero {
     grid-column: span 2;
     grid-row: auto;
     aspect-ratio: 16 / 9;
   }
 
-.vc-app .lists {
+.vc-app.vc-app .lists {
     grid-template-columns: minmax(0, 1fr);
   }
 
 }
 
 @media (max-width: 40rem) {
-.vc-app .hero-tour {
+.vc-app.vc-app .hero-tour {
     min-height: clamp(24rem, 70svh, 34rem);
   }
 
-.vc-app .facts,
-.vc-app .notes {
+.vc-app.vc-app .facts,
+.vc-app.vc-app .notes {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .policy {
+.vc-app.vc-app .policy {
     grid-template-columns: minmax(0, 1fr);
   }
 
-.vc-app .tour__text,
-.vc-app .ilist__items p {
+.vc-app.vc-app .tour__text,
+.vc-app.vc-app .ilist__items p {
     text-align: left;
   }
 
-.vc-app .bookcard__price {
+.vc-app.vc-app .bookcard__price {
     justify-content: center;
   }
 
-.vc-app .bookcard__cta {
+.vc-app.vc-app .bookcard__cta {
     width: 100%;
   }
 
diff --git a/viator-collector/assets/icons/sprite.svg b/viator-collector/assets/icons/sprite.svg
index 7ab87c7..cd72f4b 100644
--- a/viator-collector/assets/icons/sprite.svg
+++ b/viator-collector/assets/icons/sprite.svg
@@ -1,4 +1,4 @@
-  <svg class="sprite" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg">
+  <svg class="sprite" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" style="position:absolute;width:0;height:0;overflow:hidden">
     <defs>
       <path id="ringPathScroll" fill="none" d="M50,50 m-39,0 a39,39 0 1,1 78,0 a39,39 0 1,1 -78,0" />
     </defs>
diff --git a/viator-collector/assets/js/vc-design.js b/viator-collector/assets/js/vc-design.js
index b3cda7d..de5591d 100644
--- a/viator-collector/assets/js/vc-design.js
+++ b/viator-collector/assets/js/vc-design.js
@@ -92,4 +92,57 @@
     var g = app.querySelector(".gallery, .tour-gallery");
     if (g) g.scrollIntoView({ behavior: "smooth" });
   });
+
+  /* ---------- gallery lightbox (zoom / view photos) ---------- */
+  (function () {
+    var imgs = Array.prototype.slice.call(app.querySelectorAll(".gallery img"));
+    if (!imgs.length) return;
+
+    var host = imgs[0].closest(".vc-app") || document.body;
+    var box = document.createElement("div");
+    box.className = "vc-lightbox" + (imgs.length < 2 ? " vc-lightbox--single" : "");
+    box.setAttribute("role", "dialog");
+    box.setAttribute("aria-modal", "true");
+    box.innerHTML =
+      '<button class="vc-lightbox__btn vc-lightbox__prev" type="button" aria-label="Previous"><svg class="icon icon--24" aria-hidden="true"><use href="#i-arrow-left"></use></svg></button>' +
+      '<img class="vc-lightbox__img" alt="">' +
+      '<button class="vc-lightbox__btn vc-lightbox__next" type="button" aria-label="Next"><svg class="icon icon--24" aria-hidden="true"><use href="#i-arrow-right"></use></svg></button>' +
+      '<button class="vc-lightbox__btn vc-lightbox__close" type="button" aria-label="Close"><svg class="icon icon--24" aria-hidden="true"><use href="#i-x"></use></svg></button>' +
+      '<span class="vc-lightbox__count"></span>';
+    host.appendChild(box);
+
+    var bigImg = box.querySelector(".vc-lightbox__img");
+    var count = box.querySelector(".vc-lightbox__count");
+    var idx = 0;
+
+    function show(i) {
+      idx = (i + imgs.length) % imgs.length;
+      bigImg.src = imgs[idx].currentSrc || imgs[idx].src;
+      bigImg.alt = imgs[idx].alt || "";
+      count.textContent = (idx + 1) + " / " + imgs.length;
+    }
+    function open(i) {
+      show(i);
+      box.classList.add("is-open");
+      document.documentElement.style.overflow = "hidden";
+    }
+    function close() {
+      box.classList.remove("is-open");
+      document.documentElement.style.overflow = "";
+    }
+
+    imgs.forEach(function (img, i) {
+      img.addEventListener("click", function () { open(i); });
+    });
+    box.querySelector(".vc-lightbox__prev").addEventListener("click", function () { show(idx - 1); });
+    box.querySelector(".vc-lightbox__next").addEventListener("click", function () { show(idx + 1); });
+    box.querySelector(".vc-lightbox__close").addEventListener("click", close);
+    box.addEventListener("click", function (e) { if (e.target === box) close(); });
+    document.addEventListener("keydown", function (e) {
+      if (!box.classList.contains("is-open")) return;
+      if (e.key === "Escape") close();
+      else if (e.key === "ArrowLeft") show(idx - 1);
+      else if (e.key === "ArrowRight") show(idx + 1);
+    });
+  })();
 })();
diff --git a/viator-collector/build/scope-css.js b/viator-collector/build/scope-css.js
index c90e779..72a13c7 100644
--- a/viator-collector/build/scope-css.js
+++ b/viator-collector/build/scope-css.js
@@ -17,7 +17,11 @@
 'use strict';
 const fs = require('fs');
 
-const SCOPE = process.env.VC_SCOPE || '.vc-app';
+// Doubled class (`.vc-app.vc-app`) so every ported rule carries an extra class
+// of specificity — enough to win against Astra's content selectors (e.g.
+// `.ast-… .entry-content a`) without touching the markup, which still only
+// needs a single `class="vc-app"`. Override with VC_SCOPE if ever needed.
+const SCOPE = process.env.VC_SCOPE || '.vc-app.vc-app';
 
 function prefixSelector(sel) {
   sel = sel.trim();
diff --git a/viator-collector/includes/class-vc-display.php b/viator-collector/includes/class-vc-display.php
index 5fca79d..f9804be 100644
--- a/viator-collector/includes/class-vc-display.php
+++ b/viator-collector/includes/class-vc-display.php
@@ -11,6 +11,9 @@ class VC_Display {
 		'viator_top_destinations',
 		'viator_top_attractions',
 		'viator_browse_activities',
+		'viator_bus_tours',
+		'viator_about',
+		'viator_articles',
 		'viator_faq',
 		'viator_testimonials',
 		'viator_tour_card',
@@ -24,9 +27,12 @@ class VC_Display {
 	);
 
 	public static function init() {
-		// Priority 20 so Astra has already registered/enqueued its stylesheet;
-		// our CSS then loads after it and wins equal-specificity ties.
-		add_action( 'wp_enqueue_scripts', array( __CLASS__, 'enqueue_assets' ), 20 );
+		// Priority 100 so the theme (Astra + child) has already enqueued ALL of
+		// its stylesheets — including the parent style.css and the child's chrome
+		// CSS, which are enqueued by the theme at priority 20 and would otherwise
+		// print AFTER us (plugins run before themes at equal priority) and win
+		// equal-specificity ties. Loading last makes our design win those ties.
+		add_action( 'wp_enqueue_scripts', array( __CLASS__, 'enqueue_assets' ), 100 );
 		add_action( 'template_redirect', array( __CLASS__, 'maybe_enrich_single' ) );
 		add_action( 'pre_get_posts', array( __CLASS__, 'filter_archive_query' ) );
 		add_filter( 'single_template', array( __CLASS__, 'single_template' ) );
@@ -146,11 +152,15 @@ class VC_Display {
 		wp_enqueue_style( 'vc-fonts', 'https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;700;800&display=swap', array(), null );
 
 		// One scoped stylesheet (.vc-app) covers listing, single, and homepage
-		// sections — ported from the "Hop On Hop Off" design. Depend on the Astra
-		// theme stylesheet (when present) so our rules load AFTER it and win ties.
+		// sections — ported from the "Hop On Hop Off" design. Declare every theme
+		// stylesheet that could fight ours as a dependency (when present) so our
+		// rules always print AFTER them and win equal-specificity ties. We enqueue
+		// at priority 100, so by now the theme (priority 20) has registered them.
 		$deps = array( 'vc-fonts' );
-		if ( wp_style_is( 'astra-theme-css', 'registered' ) ) {
-			$deps[] = 'astra-theme-css';
+		foreach ( array( 'astra-theme-css', 'astra-parent', 'hoho-chrome' ) as $handle ) {
+			if ( wp_style_is( $handle, 'registered' ) ) {
+				$deps[] = $handle;
+			}
 		}
 		wp_enqueue_style( 'vc-design', VC_PLUGIN_URL . 'assets/css/vc-design.css', $deps, VC_VERSION );
 		wp_add_inline_style( 'vc-design', self::astra_overrides() );
@@ -180,42 +190,89 @@ class VC_Display {
 					. '.vc-fullwidth.ast-page-builder-template .site-main>article'
 					. '{padding:0!important;margin:0!important;border:0!important;max-width:none!important;}',
 				'.vc-fullwidth #primary,.vc-fullwidth #content{margin:0!important;padding:0!important;}',
+				// display:block undoes Astra's `.site-content .ast-container{display:flex}`
+				// (≥922px), which otherwise sizes our content to its contents instead
+				// of filling the full-width container.
 				'.vc-fullwidth .site-content .ast-container,.vc-fullwidth .ast-container'
-					. '{max-width:none!important;padding-left:0!important;padding-right:0!important;}',
+					. '{max-width:none!important;padding-left:0!important;padding-right:0!important;display:block!important;}',
 				'.vc-fullwidth .entry-content{margin-block:0!important;}',
 				'.vc-fullwidth .site-content{padding:0!important;}',
 				// Guard against a stray horizontal scrollbar from any full-bleed child.
 				'body.vc-fullwidth{overflow-x:hidden;}',
 				// A gradient stands in when no hero image is set, so the banner is
 				// never blank.
-				'.vc-app .hero__media,.vc-app .hero-tour{background:linear-gradient(120deg,#101317,#2cafc2);}',
+				'.vc-app.vc-app .hero__media,.vc-app.vc-app .hero-tour{background:linear-gradient(120deg,#101317,#2cafc2);}',
 				// Normalize: stop Astra from decorating our components. Its
 				// .entry-content rules (underlined links, list bullets/indent)
 				// out-specify our scoped base, so reset them here (!important beats
-				// e.g. `.ast-single-post .entry-content a`). The .vc-app.vc-app
-				// doubling lifts specificity without touching design class rules.
-				'.vc-app a,.vc-app.vc-app a{text-decoration:none;box-shadow:none;}',
-				'.vc-app :is(ul,ol),.vc-app.vc-app :is(ul,ol){list-style:none!important;margin:0!important;padding:0!important;}',
-				'.vc-app li{margin:0!important;}',
+				// e.g. `.ast-single-post .entry-content a`). Every selector matches
+				// the doubled `.vc-app.vc-app` scope of the main stylesheet so these
+				// patches keep winning against it, not just against the theme.
+				'.vc-app.vc-app a{text-decoration:none;box-shadow:none;}',
+				// No !important on margin/padding: the doubled .vc-app.vc-app scope
+				// already out-specifies Astra's list rules, and !important here was
+				// steamrolling design lists that need their own spacing — e.g. the
+				// rail (<ul class="rail">) whose vertical padding gives the hover glow
+				// room. list-style stays !important (purely cosmetic; prose lists
+				// re-enable bullets via a higher-specificity rule).
+				'.vc-app.vc-app :is(ul,ol){list-style:none!important;margin:0;padding:0;}',
+				'.vc-app.vc-app li{margin:0;}',
 				// …but keep the tour "Overview" prose (the_content) readable.
-				'.vc-app .tour__text a{text-decoration:underline;}',
-				'.vc-app .tour__text ul{list-style:disc!important;margin:1em 0!important;padding-inline-start:1.5em!important;}',
-				'.vc-app .tour__text ol{list-style:decimal!important;margin:1em 0!important;padding-inline-start:1.5em!important;}',
-				'.vc-app .tour__text li{margin:.25em 0!important;}',
+				'.vc-app.vc-app .tour__text a{text-decoration:underline;}',
+				'.vc-app.vc-app .tour__text ul{list-style:disc!important;margin:1em 0!important;padding-inline-start:1.5em!important;}',
+				'.vc-app.vc-app .tour__text ol{list-style:decimal!important;margin:1em 0!important;padding-inline-start:1.5em!important;}',
+				'.vc-app.vc-app .tour__text li{margin:.25em 0!important;}',
 				// Links must inherit the design colour (Astra colours links with its
 				// theme colour, which turned white card titles/destination names into
 				// coloured text). Buttons keep their own colour.
-				'.vc-app a:not(.btn){color:inherit;}',
-				'.vc-app .tour__text a{color:var(--c-teal);}',
+				// …but not ring-badges: they set their own colour on the <a>, and this
+				// inherit rule out-specifies .ring-badge--top/--scroll, which turned
+				// the badge text white (inherited) on light backgrounds.
+				'.vc-app.vc-app a:not(.btn):not(.ring-badge){color:inherit;}',
+				'.vc-app.vc-app .tour__text a{color:var(--c-teal);}',
 				// Real tour titles are far longer than the mockup\'s city names — clamp
 				// them and stop price/duration values wrapping mid-number.
-				'.vc-app .dcard__title{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}',
-				'.vc-app .titem__desc{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}',
-				'.vc-app .dcard__meta .meta__v{white-space:nowrap;}',
+				'.vc-app.vc-app .dcard__title{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}',
+				'.vc-app.vc-app .titem__desc{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}',
+				// Real tour descriptions run long; the on-hover card blurb clamps to
+				// three lines with an ellipsis instead of spilling over the card.
+				'.vc-app.vc-app .dcard__desc p{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}',
+				'.vc-app.vc-app .dcard__meta .meta__v{white-space:nowrap;}',
+				// Astra's page-builder layout centres/limits every entry-content child
+				// (max-width:none; margin:auto), which flattened the hero inset. Our
+				// sections are full-bleed, so re-assert 0 side-margins; !important
+				// beats Astra's 4-class selector. The hero keeps its small inset — the
+				// only section with an intentional side margin.
+				'.vc-app.vc-app>*{max-width:none!important;margin-inline:0!important;}',
+				// Heroes keep their small inset (rounded card look) — .hero on the
+				// home/archive pages and .hero-tour on the single-tour page. Without
+				// this they went full-bleed after the margin-inline:0 reset above.
+				'.vc-app.vc-app>.hero,.vc-app.vc-app>.hero-tour{margin:var(--page-inset)!important;}',
+				// Let vertical decorations (rotating badges, card glow, promo bus, FAQ
+				// watermark) escape, but keep the horizontal axis clipped so a
+				// full-bleed section or decorative element can't cause a mobile
+				// sideways scroll. overflow-x:clip (unlike hidden) does NOT force
+				// overflow-y to auto, so the y-axis stays truly visible.
+				'.vc-app.vc-app{overflow-x:clip;overflow-y:visible;}',
+				// Astra wraps the content in article/.entry-content/.ast-container,
+				// some of which clip overflow — that cut the card hover glow at the
+				// rail edges. Open them up on our pages only (page scroll stays
+				// contained by body.vc-fullwidth{overflow-x:hidden}).
+				'.vc-fullwidth .site-main,.vc-fullwidth #primary,.vc-fullwidth #content,'
+					. '.vc-fullwidth .site-content,.vc-fullwidth .ast-container,'
+					. '.vc-fullwidth .entry-content,.vc-fullwidth .site-main>article'
+					. '{overflow:visible!important;}',
+				// FAQ question buttons must stay flat — Astra gives <button> a shadow.
+				'.vc-app.vc-app .acc__q{box-shadow:none!important;}',
+				// Astra colours every heading on the element itself (h1–h6 and
+				// .entry-content :where(h1..h6)), beating our container-inherited
+				// colours. Make headings inherit again — no !important, so design
+				// classes (.hero__title, the white .tcard titles) keep their own.
+				'.vc-app.vc-app :is(h1,h2,h3,h4,h5,h6){color:inherit;}',
 				// Typography: force the design font over Astra inside our scopes.
-				'.vc-app,.vc-app h1,.vc-app h2,.vc-app h3,.vc-app h4,.vc-app h5,.vc-app h6,'
-					. '.vc-app p,.vc-app a,.vc-app span,.vc-app li,.vc-app button,.vc-app input,'
-					. '.vc-app select,.vc-app textarea,.vc-app blockquote'
+				'.vc-app.vc-app,.vc-app.vc-app h1,.vc-app.vc-app h2,.vc-app.vc-app h3,.vc-app.vc-app h4,.vc-app.vc-app h5,.vc-app.vc-app h6,'
+					. '.vc-app.vc-app p,.vc-app.vc-app a,.vc-app.vc-app span,.vc-app.vc-app li,.vc-app.vc-app button,.vc-app.vc-app input,'
+					. '.vc-app.vc-app select,.vc-app.vc-app textarea,.vc-app.vc-app blockquote'
 					. '{font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}',
 			)
 		);
diff --git a/viator-collector/includes/class-vc-sections.php b/viator-collector/includes/class-vc-sections.php
index 7f6ae7a..b48ee4b 100644
--- a/viator-collector/includes/class-vc-sections.php
+++ b/viator-collector/includes/class-vc-sections.php
@@ -15,6 +15,9 @@ class VC_Sections {
 	const TOP_ATTRS  = 'viator_top_attractions';
 	const ACTIVITIES = 'viator_browse_activities';
 	const TOP_TOURS  = 'viator_top_tours';
+	const BUS_TOURS  = 'viator_bus_tours';
+	const ABOUT      = 'viator_about';
+	const ARTICLES   = 'viator_articles';
 	const FAQ        = 'viator_faq';
 	const REVIEWS    = 'viator_testimonials';
 
@@ -28,6 +31,9 @@ class VC_Sections {
 		add_shortcode( self::TOP_ATTRS, array( __CLASS__, 'top_attractions' ) );
 		add_shortcode( self::ACTIVITIES, array( __CLASS__, 'browse_activities' ) );
 		add_shortcode( self::TOP_TOURS, array( __CLASS__, 'top_tours' ) );
+		add_shortcode( self::BUS_TOURS, array( __CLASS__, 'bus_tours' ) );
+		add_shortcode( self::ABOUT, array( __CLASS__, 'about' ) );
+		add_shortcode( self::ARTICLES, array( __CLASS__, 'articles' ) );
 		add_shortcode( self::FAQ, array( __CLASS__, 'faq' ) );
 		add_shortcode( self::REVIEWS, array( __CLASS__, 'testimonials' ) );
 	}
@@ -130,7 +136,7 @@ class VC_Sections {
 	 * Open a titled rail section and return its unique rail id. Caller fills the
 	 * <ul> with cards and then calls close_rail().
 	 */
-	private static function open_rail( $title, $lead, $view_all_url, $view_all_text ) {
+	private static function open_rail( $title, $lead, $view_all_url, $view_all_text, $rail_class = 'rail--dest' ) {
 		$id = 'vcRail' . ( ++self::$rail_seq );
 		ob_start();
 		?>
@@ -150,7 +156,7 @@ class VC_Sections {
 							</div>
 						</div>
 					</div>
-					<ul class="rail rail--dest" id="<?php echo esc_attr( $id ); ?>">
+					<ul class="rail <?php echo esc_attr( $rail_class ); ?>" id="<?php echo esc_attr( $id ); ?>">
 		<?php
 		return array( 'id' => $id, 'head' => ob_get_clean() );
 	}
@@ -450,6 +456,299 @@ class VC_Sections {
 		return ob_get_clean();
 	}
 
+	/**
+	 * [viator_bus_tours limit="4" tag="hop-on-hop-off" image_id="123"]
+	 *
+	 * The "Open Top Bus Tours…" promo block + a 4-up grid of tour cards. Backed
+	 * by the same curated/filtered tour query as the rails. The bus illustration
+	 * is a heavy image, so it comes from the Media Library via image_id (or a
+	 * direct image URL) — nothing is bundled with the plugin.
+	 */
+	public static function bus_tours( $atts ) {
+		$atts = shortcode_atts(
+			array(
+				'ids'         => '',
+				'codes'       => '',
+				'destination' => '',
+				'tag'         => '',
+				'limit'       => 4,
+				'orderby'     => 'rating',
+				'title'       => __( 'Open Top<br>Bus Tours&hellip;', 'viator-collector' ),
+				'note'        => __( 'An open-top hop on hop off bus is the best way to discover the historic and cultural sights of any city.', 'viator-collector' ),
+				'chip'        => __( 'Very Fun!', 'viator-collector' ),
+				'image_id'    => '', // WordPress media attachment ID for the bus illustration.
+				'image'       => '', // …or a direct image URL.
+			),
+			$atts,
+			self::BUS_TOURS
+		);
+
+		$query = self::tour_query( $atts );
+		if ( ! $query->have_posts() ) {
+			return '';
+		}
+
+		$archive = get_post_type_archive_link( 'viator_tour' );
+		$archive = $archive ? $archive : home_url( '/' );
+
+		$bus_img = '';
+		if ( '' !== $atts['image_id'] ) {
+			// 'full' (uncropped original) — some sites register a hard-cropped
+			// square 'large', which slices decorative illustrations in half.
+			$bus_img = wp_get_attachment_image( absint( $atts['image_id'] ), 'full', false, array( 'alt' => '', 'loading' => 'lazy' ) );
+		} elseif ( '' !== $atts['image'] ) {
+			$bus_img = '<img src="' . esc_url( $atts['image'] ) . '" alt="" loading="lazy">';
+		}
+
+		ob_start();
+		?>
+		<div class="vc-app vc-sections">
+			<section class="section section--tight">
+				<div class="container bus">
+					<div class="promo">
+						<svg class="promo__route" viewBox="0 0 416 526" fill="none" aria-hidden="true" preserveAspectRatio="none">
+							<path d="M-20 470 C 90 470, 60 350, 150 330 S 300 300, 300 210 S 210 120, 300 60 S 430 40, 440 -10" stroke="#2CAFC2" stroke-dasharray="3 3" />
+						</svg>
+						<div class="promo__head">
+							<h2 class="promo__title"><?php echo wp_kses( $atts['title'], array( 'br' => array() ) ); ?></h2>
+							<a class="btn btn--white" href="<?php echo esc_url( $archive ); ?>"><span><?php echo esc_html__( 'See all', 'viator-collector' ); ?></span><?php echo vc_icon( 'arrow-ne' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></a>
+						</div>
+						<?php if ( $atts['chip'] ) : ?><span class="chip chip--accent promo__chip"><?php echo esc_html( $atts['chip'] ); ?></span><?php endif; ?>
+						<?php if ( $bus_img ) : ?><div class="promo__bus" aria-hidden="true"><?php echo $bus_img; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></div><?php endif; ?>
+						<?php if ( $atts['note'] ) : ?><p class="promo__note"><?php echo esc_html( $atts['note'] ); ?></p><?php endif; ?>
+					</div>
+
+					<ul class="bus__grid">
+						<?php
+						$i = 0;
+						while ( $query->have_posts() ) :
+							$query->the_post();
+							++$i;
+							$pid      = get_the_ID();
+							$price    = get_post_meta( $pid, '_vc_price_from', true );
+							$currency = get_post_meta( $pid, '_vc_currency', true );
+							$terms    = get_the_terms( $pid, 'viator_destination' );
+							$kicker   = ( $terms && ! is_wp_error( $terms ) ) ? $terms[0]->name : '';
+							$active   = ( 1 === $i );
+							$badge    = vc_ring_badge( 'BOOK NOW · BOOK NOW · ', get_permalink( $pid ), 'card' );
+							if ( $active ) {
+								$badge = str_replace( 'ring-badge--card', 'ring-badge--card ring-badge--accent', $badge );
+							}
+							?>
+							<li class="tcard<?php echo $active ? ' is-active' : ''; ?>">
+								<?php echo vc_tour_image_html( $pid, 'tcard__img' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+								<div class="tcard__top">
+									<?php if ( $kicker ) : ?><span class="tcard__k"><?php echo esc_html( $kicker ); ?></span><?php endif; ?>
+									<h3 class="tcard__title"><a href="<?php echo esc_url( get_permalink( $pid ) ); ?>"><?php echo esc_html( get_the_title( $pid ) ); ?></a></h3>
+								</div>
+								<div class="tcard__bottom">
+									<?php if ( '' !== (string) $price ) : ?>
+										<div class="meta">
+											<span class="meta__k"><?php echo esc_html__( 'Start at', 'viator-collector' ); ?></span>
+											<span class="meta__v"><?php echo esc_html( vc_money( $price, $currency ) ); ?></span>
+										</div>
+									<?php endif; ?>
+									<?php echo $badge; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+								</div>
+							</li>
+						<?php endwhile; ?>
+					</ul>
+				</div>
+			</section>
+		</div>
+		<?php
+		wp_reset_postdata();
+		return ob_get_clean();
+	}
+
+	/**
+	 * [viator_about image_id="123" title="Hop On Hop Off" highlight="Memorable"
+	 *   stats="25+|Years Experience;;500+|Tours Conducted"]
+	 *
+	 * A static "About" marketing block (headline + chip, paragraph, stat counters
+	 * and a decorative bus). All copy is editable via attributes; the isometric
+	 * bus is a heavy image supplied from the Media Library (image_id / image).
+	 */
+	public static function about( $atts ) {
+		$atts = shortcode_atts(
+			array(
+				'title'       => __( 'Hop On Hop Off', 'viator-collector' ),
+				'highlight'   => __( 'Memorable', 'viator-collector' ),
+				'text'        => __( 'Discover cities the memorable way — hop on and off our open-top buses at every major sight and explore each place at your own pace, with expert local commentary along the way.', 'viator-collector' ),
+				'button_text' => __( 'About us', 'viator-collector' ),
+				'button_url'  => '',
+				'image_id'    => '',
+				'image'       => '',
+				'stats'       => '', // "25+|Years Experience;;500+|Tours Conducted;;430+|Tours this Year;;15+|Different Tours"
+			),
+			$atts,
+			self::ABOUT
+		);
+
+		$stats = array();
+		if ( '' !== $atts['stats'] ) {
+			foreach ( explode( ';;', $atts['stats'] ) as $pair ) {
+				$p = array_map( 'trim', explode( '|', $pair, 2 ) );
+				if ( '' !== $p[0] && isset( $p[1] ) ) {
+					$stats[] = array( 'num' => $p[0], 'label' => $p[1] );
+				}
+			}
+		}
+		if ( empty( $stats ) ) {
+			$stats = array(
+				array( 'num' => '25+', 'label' => __( 'Years Experience', 'viator-collector' ) ),
+				array( 'num' => '500+', 'label' => __( 'Tours Conducted', 'viator-collector' ) ),
+				array( 'num' => '430+', 'label' => __( 'Tours this Year', 'viator-collector' ) ),
+				array( 'num' => '15+', 'label' => __( 'Different Tours', 'viator-collector' ) ),
+			);
+		}
+
+		$button_url = $atts['button_url'];
+		if ( '' === $button_url ) {
+			$button_url = get_post_type_archive_link( 'viator_tour' );
+			$button_url = $button_url ? $button_url : home_url( '/' );
+		}
+
+		$bus_img = '';
+		if ( '' !== $atts['image_id'] ) {
+			// 'full' (uncropped original) — some sites register a hard-cropped
+			// square 'large', which slices decorative illustrations in half.
+			$bus_img = wp_get_attachment_image( absint( $atts['image_id'] ), 'full', false, array( 'alt' => '', 'loading' => 'lazy' ) );
+		} elseif ( '' !== $atts['image'] ) {
+			$bus_img = '<img src="' . esc_url( $atts['image'] ) . '" alt="" loading="lazy">';
+		}
+
+		ob_start();
+		?>
+		<div class="vc-app vc-sections">
+			<section class="section">
+				<div class="container about">
+					<div class="about__art" aria-hidden="true">
+						<span class="about__glow"></span>
+						<span class="about__trail" aria-hidden="true"></span>
+						<?php if ( $bus_img ) : ?><span class="about__bus"><?php echo $bus_img; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></span><?php endif; ?>
+						<svg class="about__arcs" viewBox="0 0 480 440" fill="none" aria-hidden="true">
+							<defs>
+								<path id="busArc" pathLength="100" d="M20 336.6V221.6C20 96.6 170 23.4 170 148.4V263.4" />
+							</defs>
+							<g stroke="#FFCC00" stroke-width="9" stroke-linecap="round" fill="none" transform="translate(16 24)">
+								<use href="#busArc" opacity="0.1" stroke-dasharray="62 100" />
+								<use href="#busArc" opacity="0.25" stroke-dasharray="69 100" transform="translate(48 22)" />
+								<use href="#busArc" opacity="0.45" stroke-dasharray="76 100" transform="translate(96 44)" />
+								<use href="#busArc" opacity="0.8" stroke-dasharray="83 100" transform="translate(144 66)" />
+							</g>
+						</svg>
+					</div>
+
+					<div class="about__body">
+						<div class="about__head">
+							<h2 class="about__title"><?php echo esc_html( $atts['title'] ); ?><?php if ( $atts['highlight'] ) : ?><span class="chip chip--accent about__chip"><?php echo esc_html( $atts['highlight'] ); ?></span><?php endif; ?></h2>
+							<a class="btn btn--dark" href="<?php echo esc_url( $button_url ); ?>"><span><?php echo esc_html( $atts['button_text'] ); ?></span><?php echo vc_icon( 'arrow-right' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></a>
+						</div>
+
+						<?php if ( $atts['text'] ) : ?><p class="about__text"><?php echo esc_html( $atts['text'] ); ?></p><?php endif; ?>
+
+						<dl class="stats">
+							<?php
+							foreach ( $stats as $s ) :
+								$num    = $s['num'];
+								$suffix = '';
+								if ( preg_match( '/^(.*?)(\+)$/', $num, $m ) ) {
+									$num    = $m[1];
+									$suffix = $m[2];
+								}
+								?>
+								<div class="stat">
+									<dt class="stat__num"><?php echo esc_html( $num ); ?><?php if ( $suffix ) : ?><span><?php echo esc_html( $suffix ); ?></span><?php endif; ?></dt>
+									<dd class="stat__label"><?php echo esc_html( $s['label'] ); ?></dd>
+								</div>
+							<?php endforeach; ?>
+						</dl>
+					</div>
+				</div>
+			</section>
+		</div>
+		<?php
+		return ob_get_clean();
+	}
+
+	/**
+	 * [viator_articles limit="8" category="news"]
+	 *
+	 * A rail of the latest blog posts, styled as the design's "Latest Articles"
+	 * cards. Uses each post's featured image, time and excerpt; links to the post.
+	 */
+	public static function articles( $atts ) {
+		$atts = shortcode_atts(
+			array(
+				'title'    => __( 'Latest<br>Articles', 'viator-collector' ),
+				'lead'     => __( 'News, tips and stories from our tours.', 'viator-collector' ),
+				'limit'    => 8,
+				'category' => '',
+				'view_all' => '',
+			),
+			$atts,
+			self::ARTICLES
+		);
+
+		$args = array(
+			'post_type'           => 'post',
+			'post_status'         => 'publish',
+			'posts_per_page'      => max( 1, absint( $atts['limit'] ) ),
+			'ignore_sticky_posts' => true,
+			'no_found_rows'       => true,
+		);
+		if ( '' !== $atts['category'] ) {
+			$args['category_name'] = sanitize_title( $atts['category'] );
+		}
+
+		$query = new WP_Query( $args );
+		if ( ! $query->have_posts() ) {
+			return '';
+		}
+
+		$view_all = $atts['view_all'];
+		if ( '' === $view_all ) {
+			$posts_page = (int) get_option( 'page_for_posts' );
+			$view_all   = $posts_page ? get_permalink( $posts_page ) : home_url( '/' );
+		}
+
+		$rail = self::open_rail( $atts['title'], $atts['lead'], $view_all, __( 'See all', 'viator-collector' ), 'rail--art' );
+
+		ob_start();
+		echo $rail['head']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
+		$i = 0;
+		while ( $query->have_posts() ) :
+			$query->the_post();
+			++$i;
+			$pid     = get_the_ID();
+			$active  = ( 1 === $i );
+			$img     = has_post_thumbnail( $pid ) ? get_the_post_thumbnail( $pid, 'large', array( 'class' => 'acard__img', 'loading' => 'lazy', 'alt' => '' ) ) : '';
+			$time    = human_time_diff( (int) get_post_time( 'U', true, $pid ), (int) current_time( 'timestamp', true ) );
+			$excerpt = get_the_excerpt( $pid );
+			$badge   = vc_ring_badge( 'READ MORE · READ MORE · ', get_permalink( $pid ), 'card' );
+			if ( $active ) {
+				$badge = str_replace( 'ring-badge--card', 'ring-badge--card ring-badge--accent', $badge );
+			}
+			?>
+			<li class="acard<?php echo $active ? ' is-active' : ''; ?>">
+				<div class="acard__media">
+					<?php echo $img; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+					<span class="chip chip--glass acard__time"><?php printf( /* translators: %s: human-readable time difference, e.g. "3 hours". */ esc_html__( '%s ago', 'viator-collector' ), esc_html( $time ) ); ?></span>
+					<div class="acard__overlay">
+						<h3 class="acard__title"><a href="<?php echo esc_url( get_permalink( $pid ) ); ?>"><?php echo esc_html( get_the_title( $pid ) ); ?></a></h3>
+						<?php echo $badge; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+					</div>
+				</div>
+				<?php if ( $excerpt ) : ?><p class="acard__excerpt"><?php echo esc_html( $excerpt ); ?></p><?php endif; ?>
+			</li>
+			<?php
+		endwhile;
+		echo self::close_rail(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
+		wp_reset_postdata();
+		return ob_get_clean();
+	}
+
 	/**
 	 * Shared tour query for the landing sections. Supports curation (ids /
 	 * product codes) and filtering (destination / tag), with a sane fallback.
diff --git a/viator-collector/includes/helpers.php b/viator-collector/includes/helpers.php
index 12c8650..776b996 100644
--- a/viator-collector/includes/helpers.php
+++ b/viator-collector/includes/helpers.php
@@ -595,7 +595,10 @@ function vc_print_icon_sprite() {
  * e.g. vc_icon( 'star', 'rating__star' ) => <svg class="icon rating__star">…</svg>
  */
 function vc_icon( $name, $extra_class = '' ) {
-	$name  = preg_replace( '/[^a-z0-9\-]/', '', 'i-' . ltrim( (string) $name, 'i-' ) );
+	// Strip an existing "i-" prefix (once), then re-add it. ltrim() with a
+	// charlist would eat any leading i/-, turning "instagram" into "nstagram".
+	$slug  = preg_replace( '/^i-/', '', (string) $name );
+	$name  = preg_replace( '/[^a-z0-9\-]/', '', 'i-' . $slug );
 	$class = 'icon' . ( $extra_class ? ' ' . $extra_class : '' );
 	return '<svg class="' . esc_attr( $class ) . '" aria-hidden="true"><use href="#' . esc_attr( $name ) . '"></use></svg>';
 }
diff --git a/viator-collector/templates/single-viator_tour.php b/viator-collector/templates/single-viator_tour.php
index 1ea172b..7aa9f6e 100644
--- a/viator-collector/templates/single-viator_tour.php
+++ b/viator-collector/templates/single-viator_tour.php
@@ -38,9 +38,18 @@ while ( have_posts() ) :
 	?>
 	<div class="vc-app vc-single">
 		<section class="hero-tour">
-			<?php if ( $primary ) : ?>
+			<?php
+			// Prefer a WordPress featured image (full size, responsive srcset) for a
+			// sharp hero — Viator's own image URLs cap out around 720px and look soft
+			// blown up to a full-width banner. Fall back to the Viator primary image.
+			if ( has_post_thumbnail( $post_id ) ) :
+				echo get_the_post_thumbnail( $post_id, 'full', array( 'class' => 'hero-tour__photo', 'fetchpriority' => 'high', 'alt' => '', 'sizes' => '100vw' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
+			elseif ( $primary ) :
+				?>
 				<img class="hero-tour__photo" src="<?php echo esc_url( $primary ); ?>" alt="" fetchpriority="high">
-			<?php endif; ?>
+				<?php
+			endif;
+			?>
 			<div class="hero-tour__sky" aria-hidden="true"></div>
 			<div class="container">
 				<div class="hero-tour__block">
diff --git a/viator-collector/viator-collector.php b/viator-collector/viator-collector.php
index 939b2a9..d0bdad1 100644
--- a/viator-collector/viator-collector.php
+++ b/viator-collector/viator-collector.php
@@ -4,13 +4,13 @@ defined('ABSPATH') || exit;
 /**
  * Plugin Name: Viator Collector
  * Description: Import Viator tours using the Viator Partner API and display them with native WordPress post types, templates, and shortcodes.
- * Version: 1.8.4
+ * Version: 1.8.15
  * Author: Amir Bagheri
  * License: GPL-2.0-or-later
  * Text Domain: viator-collector
  */
 
-define('VC_VERSION', '1.8.4');
+define('VC_VERSION', '1.8.15');
 define('VC_PLUGIN_FILE', __FILE__);
 define('VC_PLUGIN_DIR', plugin_dir_path(__FILE__));
 define('VC_PLUGIN_URL', plugin_dir_url(__FILE__));