/*
Theme Name: Vienna Tickets
Theme URI: https://vienna-tickets.at/
Author: AnorWeb
Author URI: https://anorweb.com/
Description: A ticket-sales theme for Vienna's attractions. Bright, open destination-marketing layout: white ground, soft mint and forest-green fields, generously rounded imagery with no card chrome, and light-weight display type. Self-hosted fonts, a hand-drawn POI map, and no external requests. Plain PHP / no page builder.
Version: 4.3.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vienna-tickets
*/

/* =========================================================================
   0. Self-hosted type (GDPR-safe, zero external requests)
   The reference uses Stabil Grotesk, which is licensed and cannot be shipped.
   Jost is the closest geometric grotesk already in the repo; the register is
   matched by WEIGHT and SPACING, not by chasing the exact face — display type
   sits at 400/500, never bold, with open line-height.
   ========================================================================= */
@font-face { font-family: "Jost"; font-weight: 400; font-style: normal; font-display: swap; src: url("assets/fonts/jost-400.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-weight: 500; font-style: normal; font-display: swap; src: url("assets/fonts/jost-500.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-weight: 600; font-style: normal; font-display: swap; src: url("assets/fonts/jost-600.woff2") format("woff2"); }
@font-face { font-family: "Spectral"; font-weight: 400; font-style: normal; font-display: swap; src: url("assets/fonts/spectral-400.woff2") format("woff2"); }

/* =========================================================================
   1. Tokens
   ========================================================================= */
:root {
	--vt-ground:      #ffffff;
	--vt-panel:       #ffffff;
	--vt-panel-2:     #e9f1ec;   /* pale mint section field */
	--vt-panel-3:     #f4f1fb;   /* pale lavender field */

	--vt-ink:         #1d2430;   /* dark blue-grey, never pure black */
	--vt-ink-soft:    #48505e;
	--vt-muted:       #78808e;
	--vt-on-dark:     #ffffff;
	--vt-on-dark-dim: rgba(255, 255, 255, .76);

	--vt-green:       #336361;   /* the action colour */
	--vt-green-deep:  #0d3b34;   /* solid bands, footer, hero */
	--vt-green-lift:  #27524f;

	--vt-violet:      #7b6ad4;
	--vt-lavender:    #b9a6f0;
	--vt-mint:        #cfe4d8;

	--vt-line:        #e3e6ea;
	--vt-line-firm:   #ccd2d9;
	--vt-line-dark:   rgba(255, 255, 255, .22);

	--vt-ok:          #2f6a46;
	--vt-warn:        #8a5a12;
	--vt-signal:      #336361;   /* alias — the primary action is the green */

	--vt-sans:  "Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
	--vt-serif: "Spectral", Georgia, serif;

	/* Generous, consistent rounding is the single loudest signal of this world. */
	--vt-r-sm: 10px;
	--vt-r:    15px;
	--vt-r-lg: 24px;
	--vt-r-xl: 34px;
	--vt-r-pill: 60px;

	/* Light, diffuse elevation. Nothing hard-edged. */
	--vt-shadow-sm: 0 2px 6px rgba(29, 36, 48, .04), 0 10px 26px -14px rgba(29, 36, 48, .10);
	--vt-shadow:    0 4px 12px rgba(29, 36, 48, .05), 0 24px 50px -24px rgba(29, 36, 48, .16);
	--vt-shadow-lg: 0 8px 20px rgba(29, 36, 48, .06), 0 40px 80px -36px rgba(29, 36, 48, .20);
	--vt-shadow-signal: 0 4px 12px rgba(51, 99, 97, .18), 0 18px 34px -18px rgba(51, 99, 97, .42);

	--vt-sp-1: .35rem;
	--vt-sp-2: .6rem;
	--vt-sp-3: .95rem;
	--vt-sp-4: 1.4rem;
	--vt-sp-5: 2rem;
	--vt-sp-6: 3rem;
	--vt-sp-7: 4.5rem;
	--vt-gap:     clamp(1.1rem, 2.4vw, 1.9rem);
	--vt-gap-lg:  clamp(2rem, 5vw, 4rem);
	--vt-pad-card: clamp(1.4rem, 2.8vw, 2.2rem);
	--vt-gutter:  clamp(1.15rem, 4vw, 2.75rem);
	--vt-section-y: clamp(3.5rem, 7.5vw, 7rem);
	--vt-tap: 44px;

	--vt-maxw: 1320px;
	--vt-maxw-narrow: 68ch;
	--vt-header-h: 82px;

	--vt-ease: cubic-bezier(.23, 1, .32, 1);
	--vt-dur:    190ms;
	--vt-dur-lg: 380ms;
	--vt-lift: -3px;
}

/* =========================================================================
   2. Reset / base
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--vt-sans);
	font-size: clamp(1rem, .96rem + .2vw, 1.06rem);
	font-weight: 400;
	line-height: 1.62;
	color: var(--vt-ink);
	background: var(--vt-ground);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	/* `clip`, not `hidden`: `overflow-x: hidden` turns body into a scroll
	   container and silently breaks `position: sticky` on every descendant. */
	overflow-x: clip;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition-duration: .001ms !important; }
	.js .vt-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--vt-green); text-decoration: none; transition: color var(--vt-dur) var(--vt-ease); }
a:hover { color: var(--vt-green-deep); }

/* Display type is LIGHT and open — never bold, never tightly tracked. */
h1, h2, h3, h4 {
	font-family: var(--vt-sans);
	font-weight: 400;
	line-height: 1.16;
	color: var(--vt-ink);
	margin: 0 0 .5em;
	letter-spacing: -.015em;
	text-wrap: balance;
}
h1 { font-size: clamp(2.3rem, 1.5rem + 3.4vw, 4rem); }
h2 { font-size: clamp(1.8rem, 1.3rem + 2vw, 2.7rem); }
h3 { font-size: clamp(1.18rem, 1.05rem + .7vw, 1.5rem); font-weight: 500; }
h4 { font-weight: 500; }
p { margin: 0 0 1.1em; text-wrap: pretty; }
ul, ol { margin: 0 0 1.1em; padding-left: 1.2em; }
li { margin-bottom: .45em; }
li::marker { color: var(--vt-green); }
strong { font-weight: 500; }
blockquote {
	margin: 1.7em 0; padding: var(--vt-sp-4) var(--vt-sp-5);
	background: var(--vt-panel-2); border-radius: var(--vt-r);
	font-size: 1.1em; color: var(--vt-ink);
}
hr { border: 0; border-top: 1px solid var(--vt-line); margin: var(--vt-gap) 0; }

.vt-price, .vt-banner__price, .vt-hero__stat, .vt-book-bar__price,
.vt-avail, .vt-att-hero__facts, .vt-post-meta { font-variant-numeric: tabular-nums; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 1000; background: var(--vt-green-deep); color: #fff; padding: .75em 1.25em; border-radius: 0 0 var(--vt-r) 0; }
.skip-link:focus { left: 0; }
:focus-visible { outline: 2px solid var(--vt-green); outline-offset: 3px; }

/* =========================================================================
   3. Layout
   ========================================================================= */
.vt-container { width: 100%; max-width: var(--vt-maxw); margin-inline: auto; padding-inline: var(--vt-gutter); }
.vt-container--narrow { max-width: var(--vt-maxw-narrow); }
.vt-section { padding-block: var(--vt-section-y); }
.vt-section--tight { padding-block: clamp(2.2rem, 4vw, 3.4rem); }
.vt-section--cta { padding-top: 100px; padding-bottom: var(--vt-section-y); }
.vt-section--alt { background: var(--vt-panel-2); }

.vt-eyebrow {
	display: flex; align-items: center; gap: .55rem;
	font-size: .85rem; font-weight: 500; letter-spacing: 0;
	color: var(--vt-green); margin: 0 0 var(--vt-sp-3);
}
.vt-eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.vt-section-head--center .vt-eyebrow { justify-content: center; }
.vt-lead { font-size: 1.12em; line-height: 1.6; color: var(--vt-ink-soft); max-width: 62ch; }
.vt-section-head { max-width: 46rem; margin-bottom: var(--vt-gap-lg); }
.vt-section-head--center { margin-inline: auto; text-align: center; }
.vt-section-head--center .vt-lead { margin-inline: auto; }
.vt-gradient-text { color: var(--vt-green); }

.vt-grid { display: grid; gap: var(--vt-gap); }
.vt-grid--2, .vt-grid--3 { grid-template-columns: minmax(0, 1fr); }

/* =========================================================================
   4. Buttons — soft rectangles, generously rounded
   ========================================================================= */
.vt-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	min-height: var(--vt-tap);
	font-family: var(--vt-sans); font-weight: 500; font-size: .95rem;
	letter-spacing: 0; text-transform: none; line-height: 1;
	padding: .95rem 1.5rem; border: 0; border-radius: var(--vt-r);
	cursor: pointer; text-align: center; text-decoration: none;
	transition: background var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease),
	            box-shadow var(--vt-dur) var(--vt-ease), transform 120ms var(--vt-ease);
}
.vt-btn svg { width: 1.1em; height: 1.1em; }
.vt-btn:active { transform: translateY(1px); }

.vt-btn--primary { background: var(--vt-green); color: #fff; box-shadow: var(--vt-shadow-signal); }
.vt-btn--primary:hover { background: var(--vt-green-deep); color: #fff; transform: translateY(var(--vt-lift)); }
.vt-btn--primary:active { transform: translateY(1px); }
.vt-btn--gold { background: var(--vt-green-deep); color: #fff; }
.vt-btn--gold:hover { background: var(--vt-green); color: #fff; transform: translateY(var(--vt-lift)); }
.vt-btn--outline { background: transparent; color: var(--vt-ink); box-shadow: inset 0 0 0 1px var(--vt-line-firm); }
.vt-btn--outline:hover { color: var(--vt-green); box-shadow: inset 0 0 0 1px var(--vt-green); }
.vt-btn--invert { background: #fff; color: var(--vt-green-deep); }
.vt-btn--invert:hover { background: var(--vt-panel-2); color: var(--vt-green-deep); transform: translateY(var(--vt-lift)); }
.vt-btn--sm { padding: .7rem 1.15rem; font-size: .88rem; min-height: 40px; }
.vt-btn--lg { padding: 1.1rem 1.9rem; font-size: 1rem; }
.vt-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--vt-sp-3) var(--vt-sp-4); }
/* On a plain white section a lone ghost/outline row disappears. Anything sitting
   directly on the page ground gets a real surface behind it. */
.vt-section > .vt-container > .vt-actions,
.vt-section-head + .vt-actions {
	padding: var(--vt-sp-4);
	background: var(--vt-panel-2);
	border-radius: var(--vt-r-lg);
	justify-content: center;
}
.vt-section-head--center .vt-actions, .vt-hero__inner--center .vt-actions { justify-content: center; }

/* =========================================================================
   5. Header — a white panel floating over the page, rounded underneath
   ========================================================================= */
.vt-header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; padding-inline: var(--vt-gutter); }
.vt-header__bar {
	display: flex; align-items: center; justify-content: space-between; gap: var(--vt-sp-4);
	min-height: var(--vt-header-h);
	max-width: var(--vt-maxw); margin-inline: auto;
	background: #fff;
	border-radius: 0 0 var(--vt-r-lg) var(--vt-r-lg);
	padding-inline: clamp(1rem, 2.5vw, 2rem);
	box-shadow: var(--vt-shadow-sm);
	transition: box-shadow var(--vt-dur) var(--vt-ease);
}
.vt-header.is-stuck .vt-header__bar { box-shadow: var(--vt-shadow); }
body { padding-top: 0; }
body:not(.vt-has-hero) { padding-top: calc(var(--vt-header-h) + var(--vt-sp-5)); }

.vt-brand { display: inline-flex; align-items: center; gap: .65rem; color: var(--vt-ink); flex: none; }
.vt-brand__logo { height: 40px; width: auto; max-width: 210px; }
.vt-brand__mark { width: 40px; height: 40px; border-radius: var(--vt-r-sm); background: var(--vt-green-deep); display: grid; place-items: center; color: #fff; flex: none; }
.vt-brand__name { font-weight: 500; letter-spacing: -.01em; font-size: 1.1rem; }

.vt-header__actions { display: flex; align-items: center; gap: var(--vt-sp-2); }
.vt-header__lang { display: inline-flex; }
.vt-nav__list { display: flex; gap: var(--vt-sp-4); list-style: none; margin: 0; padding: 0; }

.vt-menu-toggle {
	display: inline-flex; align-items: center; gap: .5rem;
	min-height: var(--vt-tap); padding: 0 .85rem;
	background: transparent; border: 0; border-radius: var(--vt-r-sm);
	box-shadow: inset 0 0 0 1px var(--vt-line-firm);
	color: var(--vt-ink); cursor: pointer;
	font-family: var(--vt-sans); font-size: .92rem; font-weight: 500;
	transition: box-shadow var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease);
}
.vt-menu-toggle:hover { box-shadow: inset 0 0 0 1px var(--vt-green); color: var(--vt-green); }
.vt-menu-toggle__label, .vt-header__cta-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.vt-menu-toggle__bars { display: block; width: 16px; height: 10px; position: relative; }
.vt-menu-toggle__bars span,
.vt-menu-toggle__bars::before,
.vt-menu-toggle__bars::after { content: ""; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; border-radius: 2px; }
.vt-menu-toggle__bars::before { top: 0; }
.vt-menu-toggle__bars span { top: 4.25px; }
.vt-menu-toggle__bars::after { bottom: 0; }

html.vt-menu-open { overflow: hidden; }
.vt-menu {
	position: fixed; inset: 0; z-index: 200;
	background: var(--vt-green-deep); color: #fff;
	visibility: hidden; opacity: 0;
	transition: opacity var(--vt-dur) var(--vt-ease), visibility 0s linear var(--vt-dur);
	overflow-y: auto;
}
.vt-menu.is-open { visibility: visible; opacity: 1; transition: opacity var(--vt-dur) var(--vt-ease); }
.vt-menu__inner { min-height: 100dvh; display: flex; flex-direction: column; }
.vt-menu__bar { display: flex; align-items: center; justify-content: space-between; min-height: var(--vt-header-h); }
.vt-menu .vt-brand, .vt-menu .vt-brand__name { color: #fff; }
.vt-menu__close {
	display: inline-flex; align-items: center; gap: .5rem;
	min-height: var(--vt-tap); padding: 0 1rem;
	background: transparent; border: 0; border-radius: var(--vt-r-sm);
	box-shadow: inset 0 0 0 1px var(--vt-line-dark);
	color: #fff; cursor: pointer;
	font-family: var(--vt-sans); font-size: .92rem; font-weight: 500;
	transition: background var(--vt-dur) var(--vt-ease);
}
.vt-menu__close:hover { background: rgba(255, 255, 255, .1); }
.vt-menu__nav { padding: var(--vt-sp-6) 0 var(--vt-sp-5); flex: 1; }
.vt-menu__list, .vt-menu__nav .vt-nav__list { list-style: none; margin: 0; padding: 0; display: block; }
.vt-menu__list li, .vt-menu__nav .vt-nav__list li { border-top: 1px solid var(--vt-line-dark); margin: 0; }
.vt-menu__list li:last-child, .vt-menu__nav .vt-nav__list li:last-child { border-bottom: 1px solid var(--vt-line-dark); }
.vt-menu__list a, .vt-menu__nav .vt-nav__list a {
	display: flex; align-items: center; justify-content: space-between;
	padding: clamp(.7rem, 2vw, 1.05rem) 0;
	font-size: clamp(1.7rem, 6vw, 2.7rem); font-weight: 400; letter-spacing: -.02em;
	color: #fff;
	transition: color var(--vt-dur) var(--vt-ease), transform var(--vt-dur) var(--vt-ease);
}
.vt-menu__list a::after, .vt-menu__nav .vt-nav__list a::after { content: "→"; opacity: 0; transition: opacity var(--vt-dur) var(--vt-ease); }
.vt-menu__list a:hover, .vt-menu__nav .vt-nav__list a:hover { color: var(--vt-mint); transform: translateX(.5rem); }
.vt-menu__list a:hover::after, .vt-menu__nav .vt-nav__list a:hover::after { opacity: 1; }
.vt-menu__foot { padding-bottom: var(--vt-sp-6); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--vt-sp-4); border-top: 1px solid var(--vt-line-dark); padding-top: var(--vt-sp-5); }
.vt-menu__foot-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--vt-sp-3); }
.vt-menu__contact { display: flex; flex-wrap: wrap; gap: var(--vt-sp-4); font-size: .95rem; }
.vt-menu__contact a { display: inline-flex; align-items: center; gap: .45rem; color: var(--vt-on-dark-dim); }
.vt-menu__contact a:hover { color: #fff; }
.vt-menu__lang { display: inline-flex; }

/* =========================================================================
   6. Hero — colour fields behind a white page, big rounded imagery
   ========================================================================= */
.vt-hero {
	position: relative; isolation: isolate; overflow: hidden;
	background: var(--vt-green-deep); color: #fff;
	border-radius: 0 0 var(--vt-r-xl) var(--vt-r-xl);
}
.vt-hero::before {
	content: ""; position: absolute; inset: 0; z-index: -2;
	background:
		radial-gradient(90% 120% at 8% 0%,   var(--vt-violet), transparent 58%),
		radial-gradient(80% 110% at 96% 8%,  #16564c, transparent 60%),
		linear-gradient(160deg, #2c2a63 0%, var(--vt-green-deep) 62%);
}
.vt-hero__grid { position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 90% at 78% 100%, rgba(185, 166, 240, .28), transparent 62%); }
/* No max-width here. `.vt-hero__inner` is also a `.vt-container`, which carries
   `margin-inline: auto` — narrowing the box makes those auto margins CENTRE it,
   pushing hero content off the page grid that every other section sits on.
   Constrain the text instead, and the hero lines up with the sections below. */
.vt-hero__inner { padding-top: calc(var(--vt-header-h) + clamp(3rem, 8vw, 6rem)); padding-bottom: clamp(3rem, 7vw, 5.5rem); }
.vt-hero__inner > * { max-width: 60rem; }
.vt-hero__inner--center { text-align: center; }
.vt-hero__inner--center > * { max-width: 44rem; margin-inline: auto; }
.vt-hero__badge {
	display: inline-flex; align-items: center; gap: .5rem;
	padding: .5rem 1rem; border-radius: var(--vt-r-pill);
	background: rgba(255, 255, 255, .12);
	font-size: .85rem; font-weight: 400; color: #fff;
	margin-bottom: var(--vt-sp-4);
}
.vt-hero__badge .vt-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--vt-mint); flex: none; }
.vt-hero h1 { color: #fff; margin-bottom: .35em; max-width: 17ch; font-weight: 400; }
.vt-hero__inner--center h1 { margin-inline: auto; }
.vt-hero__sub { font-size: clamp(1.05rem, .98rem + .5vw, 1.28rem); color: var(--vt-on-dark-dim); max-width: 54ch; margin-bottom: var(--vt-sp-5); }
.vt-hero__inner--center .vt-hero__sub { margin-inline: auto; }
.vt-hero__link {
	display: inline-flex; align-items: center; gap: .4rem;
	font-size: .98rem; font-weight: 500; color: #fff;
	border-bottom: 1px solid rgba(255, 255, 255, .45); padding-bottom: 2px;
	transition: color var(--vt-dur) var(--vt-ease), border-color var(--vt-dur) var(--vt-ease);
}
.vt-hero__link:hover { color: var(--vt-mint); border-color: var(--vt-mint); }
.vt-hero__link svg { width: 1em; height: 1em; }

.vt-hero__stats { display: flex; flex-wrap: wrap; gap: var(--vt-sp-3) var(--vt-sp-5); margin-top: var(--vt-sp-6); padding-top: var(--vt-sp-4); border-top: 1px solid var(--vt-line-dark); }
.vt-hero__stat { display: flex; align-items: baseline; gap: .45rem; font-size: .95rem; color: var(--vt-on-dark-dim); }
.vt-hero__stat b { font-weight: 500; font-size: 1.05rem; color: #fff; }
.vt-hero--404 .vt-hero__inner { padding-bottom: clamp(3rem, 8vw, 5.5rem); }
.vt-hero__404 { font-size: clamp(4rem, 14vw, 8rem); font-weight: 400; color: rgba(255, 255, 255, .2); margin-bottom: .1em; }

/* =========================================================================
   7. Attraction panels — a rounded photo with a white card at its corner
   ========================================================================= */
.vt-banners { display: grid; gap: var(--vt-gap); grid-template-columns: minmax(0, 1fr); }
.vt-banner {
	position: relative; display: block;
	border-radius: var(--vt-r-lg); overflow: hidden; isolation: isolate;
	min-height: clamp(300px, 62vw, 380px);
	background: var(--vt-panel-2); color: var(--vt-ink); text-decoration: none;
	/* A resting shadow so a light photo never dissolves into the white page. */
	box-shadow: var(--vt-shadow-sm);
	transition: transform var(--vt-dur) var(--vt-ease), box-shadow var(--vt-dur) var(--vt-ease);
}
.vt-banner--g1 { background: var(--vt-mint); }
.vt-banner--g2 { background: var(--vt-panel-3); }
.vt-banner--g3 { background: #dfeae3; }
.vt-banner--g4 { background: #e7e2f6; }
.vt-banner--g5 { background: #dbe7ea; }
.vt-banner__img { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; transition: transform 620ms var(--vt-ease); }
.vt-banner:hover { transform: translateY(var(--vt-lift)); box-shadow: var(--vt-shadow); color: var(--vt-ink); }
.vt-banner:hover .vt-banner__img { transform: scale(1.035); }

/* The signature move: a white card tucked into the bottom-left corner,
   overlapping the photograph rather than sitting on a scrim. */
.vt-banner__body {
	position: absolute; left: 0; bottom: 0;
	max-width: min(90%, 27rem);
	background: #fff;
	/* Only the top-right corner is rounded. The left and bottom edges run flush
	   into the panel, whose own radius + overflow does the rounding — giving a
	   bottom-left corner its own radius leaves a visible notch. */
	border-radius: 0 var(--vt-r-lg) 0 0;
	padding: var(--vt-pad-card);
}
.vt-banner__tag {
	display: inline-flex; align-items: center; gap: .35rem;
	font-size: .82rem; font-weight: 400; color: var(--vt-muted);
	margin-bottom: var(--vt-sp-2);
}
.vt-banner__tag svg { color: var(--vt-green); }
.vt-banner h3, .vt-banner__title { color: var(--vt-ink); margin: 0 0 .35em; font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem); font-weight: 400; letter-spacing: -.02em; }
/* Price and duration each get their own line: side by side they wrapped mid-phrase
   and the clock icon ended up orphaned above its own text. */
.vt-banner__meta { display: flex; flex-direction: column; align-items: flex-start; gap: .3rem; color: var(--vt-muted); font-size: .92rem; }
.vt-banner__meta > span { display: inline-flex; align-items: center; gap: .4rem; }
.vt-banner__meta svg { width: 1em; height: 1em; flex: none; }
.vt-banner__price { display: inline-flex; align-items: baseline; gap: .3rem; color: var(--vt-ink); }
.vt-banner__price b { font-size: 1.1rem; font-weight: 500; color: var(--vt-green); }
.vt-banner__price small { font-size: .78rem; color: var(--vt-muted); }
.vt-banner__arrow {
	position: absolute; top: var(--vt-sp-4); right: var(--vt-sp-4);
	width: 42px; height: 42px; border-radius: 50%;
	background: #fff; color: var(--vt-green-deep);
	display: grid; place-items: center;
	box-shadow: var(--vt-shadow-sm);
	transition: background var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease), transform var(--vt-dur) var(--vt-ease);
}
.vt-banner:hover .vt-banner__arrow { background: var(--vt-green); color: #fff; transform: translate(2px, -2px); }
.vt-banner__arrow svg { width: 18px; height: 18px; }

/* =========================================================================
   8. Content blocks — imagery and type, no card chrome
   ========================================================================= */
.vt-card { background: transparent; border: 0; border-radius: 0; overflow: visible; display: flex; flex-direction: column; }
.vt-card__media { display: block; aspect-ratio: 3/2; overflow: hidden; border-radius: var(--vt-r); }
.vt-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 620ms var(--vt-ease); }
.vt-card:hover .vt-card__media img { transform: scale(1.035); }
.vt-card__body { padding: var(--vt-sp-3) 0 0; display: flex; flex-direction: column; flex: 1; }

.vt-feature {
	position: relative;
	padding: var(--vt-sp-5) var(--vt-sp-4) var(--vt-sp-4);
	background: #fff; border-radius: var(--vt-r-lg);
	box-shadow: var(--vt-shadow-sm);
}
.vt-section--alt .vt-feature { background: #fff; }
.vt-feature__num {
	position: absolute; top: var(--vt-sp-4); right: var(--vt-sp-4);
	font-size: 2.1rem; font-weight: 400; line-height: 1;
	color: var(--vt-panel-2); letter-spacing: -.04em;
}
.vt-feature__icon {
	width: 68px; height: 68px; display: grid; place-items: center;
	border-radius: var(--vt-r); margin-bottom: var(--vt-sp-4);
	background: linear-gradient(145deg, var(--vt-green) 0%, var(--vt-green-deep) 100%);
	color: #fff;
	box-shadow: 0 6px 16px -8px rgba(51, 99, 97, .55);
}
.vt-feature__icon svg { width: 32px; height: 32px; stroke-width: 1.5; }
.vt-feature h3 { margin-bottom: .35em; }
.vt-feature p { color: var(--vt-ink-soft); margin: 0; }

.vt-trust-card { padding: 0; }
.vt-trust-card__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--vt-panel-2); color: var(--vt-green-deep); margin-bottom: var(--vt-sp-3); }
.vt-trust-card__icon svg { width: 24px; height: 24px; }
.vt-trust-card h3 { margin-bottom: .35em; }
.vt-trust-card p { color: var(--vt-ink-soft); margin: 0; }

.vt-pills { display: flex; flex-wrap: wrap; gap: var(--vt-sp-2); }
.vt-pill { display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1rem; border-radius: var(--vt-r-pill); background: var(--vt-panel-2); font-size: .9rem; color: var(--vt-ink); }
.vt-pill svg { width: 1.05em; height: 1.05em; color: var(--vt-green); flex: none; }
.vt-pill--block { display: flex; align-items: flex-start; gap: .7rem; padding: var(--vt-sp-3) var(--vt-sp-4); border-radius: var(--vt-r); background: var(--vt-panel-2); }
.vt-pill--block svg { margin-top: .2em; }

/* =========================================================================
   9. Attraction page
   ========================================================================= */
.vt-att-hero {
	position: relative; color: #fff; isolation: isolate; display: flex; align-items: flex-end;
	min-height: clamp(380px, 54vh, 560px); overflow: hidden;
	background: var(--vt-green-deep);
	border-radius: 0 0 var(--vt-r-xl) var(--vt-r-xl);
}
.vt-att-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(160deg, #2c2a63 0%, var(--vt-green-deep) 62%); }
.vt-att-hero--g1 { background: var(--vt-green-deep); }
.vt-att-hero--g2 { background: #2c2a63; }
.vt-att-hero--g3 { background: #16564c; }
.vt-att-hero__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.vt-att-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(13, 30, 28, .5) 0%, rgba(13, 30, 28, .34) 45%, rgba(13, 30, 28, .86) 100%); }
.vt-att-hero__inner { width: 100%; padding-top: calc(var(--vt-header-h) + var(--vt-sp-6)); padding-bottom: clamp(2rem, 5vw, 3.4rem); }
body:not(.vt-has-hero) .vt-att-hero__inner { padding-top: clamp(2rem, 5vw, 3.4rem); }
.vt-att-hero__inner h1 { color: #fff; margin-bottom: .25em; max-width: 18ch; }
.vt-att-hero__sub { font-size: clamp(1rem, .96rem + .45vw, 1.28rem); color: rgba(255, 255, 255, .88); max-width: 46ch; margin-bottom: var(--vt-sp-5); }
.vt-att-hero__inner .vt-breadcrumbs,
.vt-att-hero__inner h1,
.vt-att-hero__sub { text-shadow: 0 1px 16px rgba(10, 22, 20, .45); }
.vt-att-hero__facts { list-style: none; margin: var(--vt-sp-5) 0 0; padding: var(--vt-sp-3) 0 0; display: flex; flex-wrap: wrap; gap: var(--vt-sp-2) var(--vt-sp-5); border-top: 1px solid rgba(255, 255, 255, .22); }
.vt-att-hero__facts li { display: inline-flex; align-items: center; gap: .45rem; margin: 0; font-size: .92rem; color: rgba(255, 255, 255, .86); }
.vt-att-hero__facts svg { color: var(--vt-mint); flex: none; }

.vt-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-size: .85rem; color: rgba(255, 255, 255, .8); margin-bottom: var(--vt-sp-4); }
.vt-breadcrumbs a { color: var(--vt-mint); }
.vt-breadcrumbs a:hover { color: #fff; }
.vt-breadcrumbs span { opacity: .55; }
.vt-section-head .vt-breadcrumbs { color: var(--vt-muted); }
.vt-section-head .vt-breadcrumbs a { color: var(--vt-green); }

.vt-att-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap-lg); }
.vt-att-main { min-width: 0; }
.vt-att-side { min-width: 0; }
.vt-att-main :where(h2) { margin-top: 1.7em; }
.vt-att-main :where(h2):first-child { margin-top: 0; }

.vt-highlights { list-style: none; padding: 0; margin: var(--vt-sp-4) 0; display: grid; gap: var(--vt-sp-2); }
.vt-highlights li { display: flex; gap: .75rem; align-items: flex-start; margin: 0; padding: var(--vt-sp-3) var(--vt-sp-4); background: var(--vt-panel-2); border-radius: var(--vt-r); }
.vt-highlights li::before {
	content: ""; flex: none; width: 20px; height: 20px; margin-top: .2em; border-radius: 50%;
	background: var(--vt-green);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;
}
.vt-highlights--info li { background: var(--vt-panel-3); }
.vt-highlights--info li::before { background: var(--vt-violet); }

.vt-info-rows { list-style: none; margin: 0 0 var(--vt-sp-4); padding: 0; display: grid; gap: 0; }
.vt-info-rows li { display: flex; gap: .75rem; align-items: flex-start; margin: 0; padding: var(--vt-sp-3) 0; border-bottom: 1px solid var(--vt-line); font-size: .95rem; }
.vt-info-rows li:first-child { border-top: 1px solid var(--vt-line); }
.vt-info-rows svg { width: 19px; height: 19px; flex: none; color: var(--vt-green); margin-top: .15em; }
.vt-info-rows b { display: block; color: var(--vt-ink); font-weight: 500; }
.vt-info-rows span { color: var(--vt-ink-soft); }
.vt-info-rows--wide { max-width: 46rem; }
.vt-info-rows--wide li { padding: var(--vt-sp-4) 0; }

.vt-book-card {
	background: #fff; border-radius: var(--vt-r-lg); overflow: hidden;
	box-shadow: var(--vt-shadow); border: 1px solid var(--vt-line);
	scroll-margin-top: calc(var(--vt-header-h) + var(--vt-sp-4));
}
.vt-book-card__top { background: var(--vt-panel-2); color: var(--vt-ink); padding: var(--vt-pad-card); }
.vt-price { font-size: 2.4rem; font-weight: 400; line-height: 1; color: var(--vt-green-deep); letter-spacing: -.03em; }
.vt-price small { font-size: .85rem; font-weight: 400; color: var(--vt-muted); letter-spacing: 0; margin-left: .3rem; }
.vt-price--sm { font-size: 1.35rem; }
.vt-price__note { margin: var(--vt-sp-2) 0 0; font-size: .88rem; color: var(--vt-ink-soft); }
.vt-price__break { margin-top: var(--vt-sp-2); font-size: .88rem; }
.vt-price__break summary { cursor: pointer; color: var(--vt-green); font-weight: 500; }
.vt-price__break p { margin: var(--vt-sp-2) 0 0; color: var(--vt-ink-soft); }
.vt-book-card__body { padding: var(--vt-pad-card); }

.vt-booking-slot { margin-bottom: var(--vt-sp-4); }
.vt-booking-slot .latepoint-book-button-wrapper { display: block; }
.vt-booking-slot .latepoint-book-button,
.vt-booking-slot .latepoint-book-button.wp-block-button__link {
	display: flex; align-items: center; justify-content: center; gap: .5rem;
	width: 100%; min-height: var(--vt-tap);
	font-family: var(--vt-sans); font-weight: 500; font-size: 1rem;
	letter-spacing: 0; text-transform: none; line-height: 1;
	padding: 1.05rem 1.5rem; border: 0; border-radius: var(--vt-r);
	background: var(--vt-green); color: #fff; box-shadow: var(--vt-shadow-signal);
	cursor: pointer; text-decoration: none;
	transition: background var(--vt-dur) var(--vt-ease), transform 120ms var(--vt-ease), box-shadow var(--vt-dur) var(--vt-ease);
}
.vt-booking-slot .latepoint-book-button:hover { background: var(--vt-green-deep); color: #fff; transform: translateY(var(--vt-lift)); }
.vt-booking-slot .latepoint-book-button:active { transform: translateY(1px); }
.vt-booking-slot .latepoint-book-button:focus-visible { outline: 2px solid var(--vt-green-deep); outline-offset: 3px; }
.vt-booking-placeholder { text-align: center; padding: var(--vt-sp-4); background: var(--vt-panel-2); border-radius: var(--vt-r); color: var(--vt-ink-soft); }
.vt-booking-placeholder svg { margin: 0 auto var(--vt-sp-2); color: var(--vt-green); }
.vt-booking-placeholder p { margin: 0 0 var(--vt-sp-3); font-size: .9rem; }

.vt-trust { list-style: none; margin: 0 0 var(--vt-sp-4); padding: 0; display: grid; gap: var(--vt-sp-2); }
.vt-trust li { display: flex; gap: .55rem; align-items: flex-start; margin: 0; font-size: .92rem; color: var(--vt-ink-soft); }
.vt-trust svg { flex: none; color: var(--vt-green); margin-top: .2em; }
.vt-book-card__terms { display: flex; gap: .5rem; align-items: flex-start; margin: 0; padding-top: var(--vt-sp-3); border-top: 1px solid var(--vt-line); font-size: .84rem; color: var(--vt-muted); }
.vt-book-card__terms svg { flex: none; color: var(--vt-muted); margin-top: .15em; }
.vt-book-card__terms a { color: var(--vt-green); text-decoration: underline; text-underline-offset: 2px; }

.vt-conditions { margin-top: var(--vt-sp-6); background: var(--vt-panel-2); border-radius: var(--vt-r); padding: var(--vt-sp-4); }
.vt-conditions summary { cursor: pointer; font-weight: 500; color: var(--vt-ink); }
.vt-conditions__body { margin-top: var(--vt-sp-3); color: var(--vt-ink-soft); font-size: .95rem; max-width: 66ch; }

.vt-avail { display: inline-flex; align-items: center; gap: .45rem; margin-top: var(--vt-sp-3); padding: .35rem .8rem; border-radius: var(--vt-r-pill); font-size: .84rem; font-weight: 500; }
.vt-avail__dot { width: 6px; height: 6px; border-radius: 50%; flex: none; background: currentColor; }
.vt-avail--ok   { background: rgba(47, 106, 70, .12);  color: var(--vt-ok); }
.vt-avail--low  { background: rgba(138, 90, 18, .13);  color: var(--vt-warn); }
.vt-avail--out  { background: rgba(120, 128, 142, .14); color: var(--vt-muted); }

.vt-book-bar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
	background: rgba(255, 255, 255, .97); backdrop-filter: blur(10px);
	border-top: 1px solid var(--vt-line);
	padding: .6rem var(--vt-gutter) calc(.6rem + env(safe-area-inset-bottom));
	opacity: 0; transform: translateY(100%);
	transition: opacity var(--vt-dur) var(--vt-ease), transform var(--vt-dur-lg) var(--vt-ease);
}
.vt-book-bar[hidden] { display: none; }
.vt-book-bar.is-in { opacity: 1; transform: none; }
.vt-book-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--vt-sp-3); max-width: var(--vt-maxw); margin-inline: auto; }
.vt-book-bar__price { display: flex; flex-direction: column; line-height: 1.2; }
.vt-book-bar__price b { font-size: 1.2rem; font-weight: 500; color: var(--vt-green-deep); }
.vt-book-bar__price span { font-size: .78rem; color: var(--vt-muted); }
.vt-book-bar__cta { flex: 0 1 auto; }
body.vt-lp-open .vt-book-bar { display: none; }
body.vt-has-book-bar { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }

.vt-more-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem .8rem; margin: 0; font-size: .98rem; }
.vt-more-row__label { font-weight: 500; color: var(--vt-ink); }
.vt-more-row a { color: var(--vt-green); }
.vt-more-row a:hover { color: var(--vt-green-deep); text-decoration: underline; text-underline-offset: 3px; }
.vt-more-row span { color: var(--vt-line-firm); }

/* =========================================================================
   10. CTA band, reviews, contact
   ========================================================================= */
.vt-cta-band { position: relative; border-radius: var(--vt-r-xl); overflow: hidden; padding: clamp(2.6rem, 6vw, 4.6rem) var(--vt-pad-card); color: #fff; isolation: isolate; text-align: center; }
.vt-cta-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(150deg, #2c2a63 0%, var(--vt-green-deep) 65%); }
.vt-cta-band::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 110% at 88% 8%, rgba(185, 166, 240, .34), transparent 62%); }
.vt-cta-band h2 { color: #fff; }
.vt-cta-band p { color: var(--vt-on-dark-dim); max-width: 46ch; margin-inline: auto; }
.vt-cta-band .vt-actions { justify-content: center; margin-top: var(--vt-sp-5); }

.vt-review { padding: 0; display: flex; flex-direction: column; margin: 0; }
.vt-review__text { font-size: 1.08rem; line-height: 1.55; color: var(--vt-ink); margin: 0 0 var(--vt-sp-3); border: 0; padding: 0; background: none; font-style: normal; font-family: var(--vt-sans); }
.vt-review__by { margin-top: auto; font-size: .88rem; }
.vt-review__by b { color: var(--vt-ink); font-weight: 500; }
.vt-review__by span { color: var(--vt-muted); display: block; }
.vt-review__source { margin: var(--vt-sp-5) 0 0; font-size: .85rem; color: var(--vt-muted); text-align: center; }

.vt-contact-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap); margin-top: var(--vt-gap-lg); }
.vt-contact-card { display: block; padding: var(--vt-sp-5); border-radius: var(--vt-r-lg); background: var(--vt-panel-2); border: 0; color: var(--vt-ink); transition: transform var(--vt-dur) var(--vt-ease), box-shadow var(--vt-dur) var(--vt-ease); }
a.vt-contact-card:hover { transform: translateY(var(--vt-lift)); box-shadow: var(--vt-shadow); }
.vt-contact-card--static { background: var(--vt-panel-3); }
.vt-contact-card__icon { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; color: var(--vt-green-deep); margin-bottom: var(--vt-sp-3); }
.vt-contact-card b { display: block; font-size: 1.1rem; font-weight: 500; margin-bottom: .2em; }
.vt-contact-card span { color: var(--vt-ink-soft); font-size: .95rem; }

/* =========================================================================
   11. POI map
   ========================================================================= */
.vt-map-wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap); align-items: start; }
.vt-map { position: relative; border-radius: var(--vt-r-lg); overflow: hidden; background: #fff; box-shadow: var(--vt-shadow-sm); }
.vt-map__svg { display: block; width: 100%; height: auto; }
.vt-map__land  { fill: #ffffff; }
.vt-map__green { fill: #cfe4d8; }
.vt-map__water { fill: none; stroke: #c3dbe4; stroke-linecap: round; }
.vt-map__road  { fill: none; stroke: #cfd8d2; }
.vt-map__place { font-family: var(--vt-sans); font-size: 16px; font-weight: 400; letter-spacing: 2px; fill: #93a09a; pointer-events: none; }
.vt-map__pin { cursor: pointer; }
.vt-map__pin-body { fill: var(--vt-green); transition: fill var(--vt-dur) var(--vt-ease); }
.vt-map__pin-dot  { fill: #fff; }
.vt-map__pulse    { fill: rgba(51, 99, 97, .16); opacity: 0; transition: opacity var(--vt-dur) var(--vt-ease); }
.vt-map__pin:hover .vt-map__pin-body, .vt-map__pin:focus-visible .vt-map__pin-body { fill: var(--vt-violet); }
.vt-map__pin:hover .vt-map__pulse, .vt-map__pin:focus-visible .vt-map__pulse { opacity: 1; }
.vt-map__label { font-family: var(--vt-sans); font-size: 17px; font-weight: 500; fill: var(--vt-ink); pointer-events: none; paint-order: stroke; stroke: rgba(255, 255, 255, .95); stroke-width: 4px; stroke-linejoin: round; }

.vt-map__list { list-style: none; margin: 0; padding: 0 var(--vt-sp-3) 0 0; display: grid; gap: 0; }
.vt-map__list li { margin: 0; border-bottom: 1px solid var(--vt-line); }
.vt-map__list li:first-child { border-top: 1px solid var(--vt-line); }
.vt-map__list a { display: block; padding: var(--vt-sp-3) 0; color: var(--vt-ink); transition: transform var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease); }
.vt-map__list a:hover { transform: translateX(.5rem); color: var(--vt-green); }
.vt-map__list-title { display: block; font-weight: 500; margin-bottom: .15em; }
.vt-map__list-meta { display: flex; align-items: flex-start; gap: .4rem; font-size: .85rem; color: var(--vt-muted); }
.vt-map__list-meta svg { flex: none; margin-top: .2em; color: var(--vt-green); }

/* =========================================================================
   12. Blog — image, date, headline, "More →". No boxes.
   ========================================================================= */
.vt-post-card {
	display: flex; flex-direction: column;
	background: #fff; border: 0; border-radius: var(--vt-r-lg); overflow: hidden;
	box-shadow: var(--vt-shadow-sm);
	transition: transform var(--vt-dur) var(--vt-ease), box-shadow var(--vt-dur) var(--vt-ease);
}
.vt-post-card:hover { transform: translateY(var(--vt-lift)); box-shadow: var(--vt-shadow); }
.vt-post-card[hidden] { display: none; }
.vt-post-card__media { display: block; aspect-ratio: 3/2; overflow: hidden; border-radius: 0; }
.vt-post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 620ms var(--vt-ease); }
.vt-post-card:hover .vt-post-card__media img { transform: scale(1.035); }
.vt-post-card__body { padding: var(--vt-pad-card); display: flex; flex-direction: column; flex: 1; }
.vt-post-card__body h2 { font-size: 1.3rem; font-weight: 400; line-height: 1.28; margin-bottom: .4em; }
.vt-post-card__body h2 a { color: var(--vt-ink); }
.vt-post-card__body h2 a:hover { color: var(--vt-green); }
.vt-post-card__body p { color: var(--vt-ink-soft); font-size: .96rem; }
.vt-post-card__more { margin-top: auto; padding-top: var(--vt-sp-2); display: inline-flex; align-items: center; gap: .4rem; font-size: .95rem; font-weight: 500; color: var(--vt-green); }
.vt-post-card:hover .vt-post-card__more { color: var(--vt-green-deep); }
.vt-post-meta { display: flex; flex-wrap: wrap; gap: .4rem; font-size: .85rem; color: var(--vt-muted); margin: 0 0 var(--vt-sp-2); }
.vt-post-meta--hero { color: rgba(255, 255, 255, .8); margin-top: var(--vt-sp-3); }
.vt-post-hero .vt-att-hero__inner h1 { max-width: 22ch; }
.vt-post-body { font-size: 1.08rem; }
.vt-post-body h2 { margin-top: 1.7em; }
.vt-post-body h3 { margin-top: 1.5em; }

.vt-pagination { margin-top: var(--vt-gap-lg); }
.vt-pagination .nav-links { display: flex; flex-wrap: wrap; gap: var(--vt-sp-2); justify-content: center; }
.vt-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 .6rem; border-radius: 50%; color: var(--vt-ink); font-size: .95rem; transition: background var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease); }
.vt-pagination .page-numbers:hover { background: var(--vt-panel-2); color: var(--vt-green); }
.vt-pagination .page-numbers.current { background: var(--vt-green); color: #fff; }

.vt-postnav__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap); }
.vt-postnav__link { display: block; padding: var(--vt-sp-4); border-radius: var(--vt-r); background: var(--vt-panel-2); color: var(--vt-ink); transition: transform var(--vt-dur) var(--vt-ease); }
.vt-postnav__link span { display: block; font-size: .82rem; color: var(--vt-muted); margin-bottom: .25em; }
.vt-postnav__link b { font-weight: 500; font-size: 1.05rem; }
.vt-postnav__link:hover { transform: translateY(var(--vt-lift)); color: var(--vt-green); }

/* =========================================================================
   13. Footer
   ========================================================================= */
.vt-footer { background: var(--vt-green-deep); color: var(--vt-on-dark-dim); padding-top: var(--vt-sp-7); border-radius: var(--vt-r-xl) var(--vt-r-xl) 0 0; margin-top: var(--vt-sp-6); }
.vt-footer a { color: var(--vt-on-dark-dim); }
.vt-footer a:hover { color: #fff; }
.vt-footer__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap-lg); padding-bottom: var(--vt-sp-6); }
.vt-footer .vt-brand, .vt-footer .vt-brand__name { color: #fff; }
.vt-footer__brand .vt-brand__logo { height: 36px; }
.vt-footer__note { margin: var(--vt-sp-4) 0; max-width: 40ch; font-size: .93rem; line-height: 1.6; }
.vt-footer h4 { color: #fff; font-size: .95rem; font-weight: 500; margin-bottom: var(--vt-sp-3); }
.vt-footer ul { list-style: none; margin: 0; padding: 0; }
.vt-footer li { margin-bottom: .5em; font-size: .95rem; }
.vt-footer__legal { border-top: 1px solid var(--vt-line-dark); padding: var(--vt-sp-4) 0; }
.vt-footer__legal summary { cursor: pointer; font-size: .88rem; }
.vt-footer__legal-body { margin-top: var(--vt-sp-3); font-size: .82rem; line-height: 1.65; color: rgba(255, 255, 255, .62); max-width: 78ch; }
.vt-footer__legal-body p { margin-bottom: .9em; }
.vt-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--vt-sp-3); padding: var(--vt-sp-4) 0 var(--vt-sp-6); font-size: .85rem; border-top: 1px solid var(--vt-line-dark); }

/* =========================================================================
   14. Motion
   ========================================================================= */
.js .vt-reveal {
	opacity: 0;
	transform: translate3d(0, 14px, 0);
	transition: opacity var(--vt-dur-lg) var(--vt-ease), transform var(--vt-dur-lg) var(--vt-ease);
	transition-delay: calc(var(--vt-d, 0) * 60ms);
}
.js .vt-reveal.is-in { opacity: 1; transform: translate3d(0, 0, 0); }
.js .vt-reveal.is-instant { transition: none !important; transition-delay: 0s !important; }
.js .vt-reveal[data-d="1"] { --vt-d: 1; }
.js .vt-reveal[data-d="2"] { --vt-d: 2; }
.js .vt-reveal[data-d="3"] { --vt-d: 3; }
.js .vt-banners .vt-reveal { transform: translate3d(0, 26px, 0); transition-duration: 520ms; }

/* =========================================================================
   15. Prose
   ========================================================================= */
.vt-prose { max-width: var(--vt-maxw-narrow); }
.vt-prose > :first-child { margin-top: 0; }
.vt-prose h2 { margin-top: 1.7em; }
.vt-prose img { border-radius: var(--vt-r); margin-block: 1.7em; }
.vt-prose a { text-decoration: underline; text-underline-offset: 2px; }

.vt-search { display: flex; gap: var(--vt-sp-2); }
.vt-search input { flex: 1; min-height: var(--vt-tap); padding: 0 1rem; border: 1px solid var(--vt-line-firm); border-radius: var(--vt-r); background: #fff; font-family: var(--vt-sans); font-size: 1rem; color: var(--vt-ink); }
.vt-search input:focus-visible { outline: 2px solid var(--vt-green); outline-offset: 2px; }

/* =========================================================================
   16. Responsive — mobile first. sm 640 · md 768 · lg 1024
   ========================================================================= */
@media (min-width: 640px) {
	.vt-grid--2, .vt-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vt-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vt-contact-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
	.vt-postnav__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vt-postnav__link--next { text-align: right; }
	.vt-banner { min-height: clamp(340px, 42vw, 420px); }
}

@media (min-width: 768px) {
	.vt-banners { grid-template-columns: repeat(6, 1fr); }
	.vt-banner { grid-column: span 3; }
	.vt-banner:first-child { grid-column: span 6; min-height: clamp(400px, 40vw, 520px); }
	.vt-menu-toggle__label, .vt-header__cta-label { position: static; width: auto; height: auto; clip-path: none; }
	.vt-menu-toggle { padding-inline: 1rem; }
}

@media (min-width: 1024px) {
	.vt-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.vt-footer__grid { grid-template-columns: 1.6fr 1fr 1fr; }
	/* A wider map, and a list that scrolls within the map's own height instead
	   of running a long way past the bottom of it. */
	.vt-map-wrap { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); align-items: start; }
	.vt-map__list {
		max-height: var(--vt-map-h, 34rem);
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		scrollbar-color: var(--vt-line-firm) transparent;
	}
	.vt-map__list::-webkit-scrollbar { width: 6px; }
	.vt-map__list::-webkit-scrollbar-thumb { background: var(--vt-line-firm); border-radius: 3px; }

	/* `stretch`, not `start` — a start-aligned track collapses to the card's
	   own height and leaves `position: sticky` no room to travel. */
	.vt-att-layout { grid-template-columns: minmax(0, 1fr) 352px; align-items: stretch; }
	.vt-att-main { order: 1; }
	.vt-att-side { order: 2; align-self: stretch; }
	.vt-book-card { position: sticky; top: calc(var(--vt-header-h) + var(--vt-sp-3)); }

	.vt-book-bar { display: none !important; }
	body.vt-has-book-bar { padding-bottom: 0; }
}

/* =========================================================================
   17. Slider — a real horizontal scroller with snap points
   ========================================================================= */
.vt-slider { position: relative; }
.vt-slider__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--vt-sp-4); margin-bottom: var(--vt-gap); }
.vt-slider__head .vt-section-head { margin-bottom: 0; }
.vt-slider__nav-group { display: none; gap: var(--vt-sp-2); flex: none; }
.vt-slider__nav {
	width: 46px; height: 46px; flex: none;
	display: grid; place-items: center;
	border: 0; border-radius: 50%;
	background: var(--vt-panel-2); color: var(--vt-green-deep);
	cursor: pointer;
	transition: background var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease), opacity var(--vt-dur) var(--vt-ease);
}
.vt-slider__nav:hover:not(:disabled) { background: var(--vt-green); color: #fff; }
.vt-slider__nav:disabled { opacity: .35; cursor: default; }
.vt-slider__nav svg { width: 20px; height: 20px; }
.vt-slider.is-static .vt-slider__nav-group { display: none !important; }

.vt-slider__track {
	/* Flex, not grid: `grid-auto-columns: minmax(0, …)` lets the implicit tracks
	   shrink to fit the container instead of overflowing it, which collapses the
	   whole carousel into one screenful of slivers. A flex basis is definite. */
	display: flex;
	gap: var(--vt-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	/* Bleed to the viewport edge so a card is visibly cut off — the affordance
	   that tells a visitor the row scrolls. */
	margin-inline: calc(var(--vt-gutter) * -1);
	padding-inline: var(--vt-gutter);
	padding-block: 4px var(--vt-sp-3);
}
.vt-slider__track::-webkit-scrollbar { display: none; }
.vt-slider__track > * {
	flex: 0 0 82%;
	scroll-snap-align: start;
	min-height: clamp(320px, 62vw, 380px);
}

@media (min-width: 640px) {
	.vt-slider__track > * { flex-basis: calc(50% - var(--vt-gap) / 2); min-height: clamp(330px, 34vw, 390px); }
}
@media (min-width: 1024px) {
	.vt-slider__track > * { flex-basis: calc(33.333% - var(--vt-gap) * 2 / 3); }
	.vt-slider__nav-group { display: flex; }
	.vt-slider__track { margin-inline: 0; padding-inline: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.vt-slider__track { scroll-behavior: auto; }
}

/* =========================================================================
   18. Placeholders — an intentional empty state, never a broken box
   ========================================================================= */
.vt-ph {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: var(--vt-sp-2); text-align: center;
	padding: var(--vt-sp-4);
	background: linear-gradient(145deg, var(--vt-panel-2) 0%, var(--vt-panel-3) 100%);
	color: var(--vt-muted); border-radius: var(--vt-r);
	font-size: .82rem; line-height: 1.35;
}
.vt-ph svg { color: var(--vt-green); opacity: .55; }
.vt-ph--card { width: 100%; height: 100%; border-radius: 0; }
.vt-ph--tall { width: 100%; height: 100%; min-height: 22rem; border-radius: var(--vt-r-lg); }
.vt-note { font-size: .84rem; color: var(--vt-muted); margin-top: var(--vt-sp-2); }

/* =========================================================================
   19. Gallery
   ========================================================================= */
.vt-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--vt-sp-3); margin: var(--vt-sp-4) 0; }
.vt-gallery__item { margin: 0; border-radius: var(--vt-r); overflow: hidden; aspect-ratio: 4/3; }
.vt-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 620ms var(--vt-ease); }
.vt-gallery__item:hover img { transform: scale(1.04); }
.vt-gallery .vt-ph { aspect-ratio: 4/3; }
/* Two or four across, never three: every gallery holds four photographs, and a
   three-column grid orphans the fourth on a row of its own. */
@media (min-width: 1024px) { .vt-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* =========================================================================
   20. Tooltip
   ========================================================================= */
.vt-tip { position: relative; display: inline-flex; }
.vt-tip__btn {
	display: inline-flex; align-items: center; gap: .35rem;
	background: none; border: 0; padding: 0; cursor: help;
	font-family: var(--vt-sans); font-size: inherit; color: var(--vt-muted);
	border-bottom: 1px dotted var(--vt-line-firm);
}
.vt-tip__btn:hover { color: var(--vt-green); }
.vt-tip__btn svg { flex: none; }
.vt-tip__bubble {
	position: absolute; bottom: calc(100% + 10px); left: 0;
	width: max-content; max-width: 17rem;
	background: var(--vt-ink); color: #fff;
	padding: .7rem .85rem; border-radius: var(--vt-r-sm);
	font-size: .82rem; line-height: 1.4;
	box-shadow: var(--vt-shadow);
	opacity: 0; visibility: hidden; transform: translateY(4px);
	transition: opacity var(--vt-dur) var(--vt-ease), transform var(--vt-dur) var(--vt-ease), visibility 0s linear var(--vt-dur);
	z-index: 20;
}
.vt-tip__bubble::after { content: ""; position: absolute; top: 100%; left: 14px; border: 6px solid transparent; border-top-color: var(--vt-ink); }
.vt-tip:hover .vt-tip__bubble,
.vt-tip__btn:focus-visible + .vt-tip__bubble {
	opacity: 1; visibility: visible; transform: none;
	transition: opacity var(--vt-dur) var(--vt-ease), transform var(--vt-dur) var(--vt-ease);
}

/* =========================================================================
   21. FAQ
   ========================================================================= */
.vt-faq { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap-lg); align-items: start; }
.vt-faq__media { position: relative; border-radius: var(--vt-r-lg); overflow: hidden; }
.vt-faq__media img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/5; }
.vt-faq__list { display: grid; gap: var(--vt-sp-2); margin-top: var(--vt-sp-4); }
.vt-faq__item { background: #fff; border-radius: var(--vt-r); padding: var(--vt-sp-4); }
.vt-faq__item summary {
	display: flex; align-items: flex-start; justify-content: space-between; gap: var(--vt-sp-3);
	cursor: pointer; list-style: none;
	font-size: 1.05rem; font-weight: 500; color: var(--vt-ink);
}
.vt-faq__item summary::-webkit-details-marker { display: none; }
.vt-faq__sign { position: relative; flex: none; width: 18px; height: 18px; margin-top: .25em; }
.vt-faq__sign::before, .vt-faq__sign::after {
	content: ""; position: absolute; inset: 0; margin: auto;
	background: var(--vt-green); border-radius: 2px;
	transition: transform var(--vt-dur) var(--vt-ease), opacity var(--vt-dur) var(--vt-ease);
}
.vt-faq__sign::before { width: 14px; height: 2px; }
.vt-faq__sign::after  { width: 2px; height: 14px; }
.vt-faq__item[open] .vt-faq__sign::after { transform: rotate(90deg); opacity: 0; }
.vt-faq__answer { padding-top: var(--vt-sp-3); color: var(--vt-ink-soft); }
.vt-faq__answer p { margin: 0; }
@media (min-width: 900px) { .vt-faq { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }

/* =========================================================================
   22. Blog filter + fully clickable cards
   ========================================================================= */
.vt-filter { display: flex; flex-wrap: wrap; gap: var(--vt-sp-2); margin-bottom: var(--vt-gap); }
.vt-filter__chip {
	display: inline-flex; align-items: center; min-height: 40px; padding: 0 1.1rem;
	border-radius: var(--vt-r-pill); background: var(--vt-panel-2); color: var(--vt-ink);
	font-size: .92rem; font-weight: 500;
	transition: background var(--vt-dur) var(--vt-ease), color var(--vt-dur) var(--vt-ease);
}
.vt-filter__chip:hover { background: var(--vt-mint); color: var(--vt-green-deep); }
.vt-filter__chip.is-on { background: var(--vt-green); color: #fff; }

/* The whole card is the hit area: the title anchor is stretched over it, so the
   markup keeps one real link and screen readers still read a normal heading. */
.vt-post-card { position: relative; }
.vt-post-card__body h2 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.vt-post-card:hover .vt-post-card__media img { transform: scale(1.035); }
.vt-post-card:hover .vt-post-card__body h2 a { color: var(--vt-green); }
.vt-post-card__media { position: relative; }

/* =========================================================================
   23. Contact intro
   ========================================================================= */
.vt-contact-intro { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vt-gap-lg); align-items: center; }
.vt-contact-intro .vt-section-head { margin-bottom: 0; }
.vt-contact-intro__media { position: relative; border-radius: var(--vt-r-lg); overflow: hidden; }
.vt-contact-intro__media img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/3; }
@media (min-width: 900px) { .vt-contact-intro { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }

/* =========================================================================
   24. Hero slider — the imagery rotates, the message does not
   ========================================================================= */
.vt-hero--slider { display: flex; flex-direction: column; }
.vt-hero__slides { position: absolute; inset: 0; z-index: -2; }
.vt-hero__slide {
	position: absolute; inset: 0;
	opacity: 0; transition: opacity 900ms var(--vt-ease);
}
.vt-hero__slide.is-on { opacity: 1; }
.vt-hero__slide img { width: 100%; height: 100%; object-fit: cover; }
/* A scrim strong enough that white display type clears 4.5:1 on any photograph. */
.vt-hero--slider::before {
	/* Heavy where the type sits, then falls away fast so the photograph is
	   actually visible on the right. White display text still clears 4.5:1
	   across the whole copy column. */
	background:
		linear-gradient(103deg, rgba(11, 48, 43, .94) 0%, rgba(11, 48, 43, .86) 34%, rgba(11, 48, 43, .42) 62%, rgba(11, 48, 43, .12) 100%),
		linear-gradient(180deg, rgba(18, 30, 27, .10) 0%, rgba(18, 30, 27, .34) 100%);
	z-index: -1;
}
.vt-hero--slider .vt-hero__grid { z-index: -1; background: radial-gradient(60% 90% at 92% 8%, rgba(123, 106, 212, .3), transparent 64%); }
.vt-hero--slider .vt-hero__inner { position: relative; z-index: 1; flex: 1; }

.vt-hero__foot {
	position: relative; z-index: 1;
	display: flex; align-items: center; justify-content: space-between; gap: var(--vt-sp-4);
	padding-bottom: var(--vt-sp-5);
}
.vt-hero__caption {
	display: inline-flex; align-items: center; gap: .45rem;
	padding: .5rem .95rem; border-radius: var(--vt-r-pill);
	background: rgba(255, 255, 255, .14);
	color: #fff; font-size: .88rem; font-weight: 500;
	transition: background var(--vt-dur) var(--vt-ease);
}
.vt-hero__caption:hover { background: rgba(255, 255, 255, .26); color: #fff; }
.vt-hero__caption svg { width: 1em; height: 1em; }
.vt-hero__dots { display: flex; gap: .45rem; flex: none; }
/* The track is a fixed 26px so the row never reflows; the visible pill is a
   pseudo-element that scales. Animating `width` here would thrash layout on
   every tick of the autoplay. */
.vt-hero__dot {
	position: relative;
	width: 26px; height: 9px; padding: 0; border: 0;
	background: none; cursor: pointer;
}
.vt-hero__dot::before {
	content: ""; position: absolute; inset: 0;
	border-radius: var(--vt-r-pill);
	background: rgba(255, 255, 255, .38);
	transform: scaleX(.346);
	transform-origin: center;
	transition: transform var(--vt-dur) var(--vt-ease), background var(--vt-dur) var(--vt-ease);
}
.vt-hero__dot:hover::before { background: rgba(255, 255, 255, .7); }
.vt-hero__dot.is-on::before { background: #fff; transform: scaleX(1); }
/* A real 44px target around a 9px visual. */
.vt-hero__dot::after { content: ""; position: absolute; inset: -18px -6px; }

@media (prefers-reduced-motion: reduce) {
	.vt-hero__slide { transition: none; }
}

/* =========================================================================
   25. Filter empty state
   ========================================================================= */
.vt-filter-empty { color: var(--vt-muted); }

/* Photo credit on a hero image. CC BY-SA requires the author and licence to be
   visible wherever the work appears, so this must stay legible — small and
   unobtrusive, never hidden. Sits on the hero's dark scrim, bottom-right. */
.vt-img-credit {
	position: absolute;
	right: 1rem;
	bottom: .6rem;
	z-index: 2;
	margin: 0;
	font-size: .68rem;
	line-height: 1.3;
	letter-spacing: .01em;
	color: rgba(255, 255, 255, .72);
	text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
}

.vt-img-credit a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: .15em;
}

.vt-img-credit a:hover,
.vt-img-credit a:focus-visible {
	color: #fff;
}

@media (min-width: 768px) {
	.vt-img-credit {
		right: 1.5rem;
		bottom: .9rem;
		font-size: .72rem;
	}
}

/* ---------------------------------------------------------------------------
   "Get tickets" overlay — pick an attraction
   Mobile-first: a full-height sheet with a scrolling list, big tap targets and
   the price on the right where a thumb can read it without opening anything.
   --------------------------------------------------------------------------- */

.vt-tickets {
	position: fixed; inset: 0; z-index: 210;
	background: var(--vt-green-deep); color: #fff;
	visibility: hidden; opacity: 0;
	transition: opacity var(--vt-dur) var(--vt-ease), visibility 0s linear var(--vt-dur);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.vt-tickets.is-open {
	visibility: visible; opacity: 1;
	transition: opacity var(--vt-dur) var(--vt-ease);
}

.vt-tickets__inner { min-height: 100dvh; display: flex; flex-direction: column; }

.vt-tickets__bar {
	display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem;
	min-height: var(--vt-header-h);
	padding-top: 1rem; padding-bottom: 1rem;
}

.vt-tickets__bar .vt-eyebrow { color: rgba(255, 255, 255, .62); margin: 0 0 .2rem; }
.vt-tickets__title { margin: 0; font-size: clamp(1.35rem, 5vw, 2rem); color: #fff; }

.vt-tickets__close {
	display: inline-flex; align-items: center; gap: .5rem;
	min-height: var(--vt-tap); padding: 0 1rem;
	background: transparent; border: 0; border-radius: var(--vt-r-sm);
	box-shadow: inset 0 0 0 1px var(--vt-line-dark);
	color: #fff; cursor: pointer; flex: none;
	font-family: var(--vt-sans); font-size: .92rem; font-weight: 500;
	transition: background var(--vt-dur) var(--vt-ease);
}
.vt-tickets__close:hover { background: rgba(255, 255, 255, .1); }
.vt-tickets__close span { display: none; }

.vt-tickets__scroll { flex: 1; padding-bottom: var(--vt-sp-5); }
.vt-tickets__list { list-style: none; margin: 0; padding: 0; }
.vt-tickets__item { margin: 0; border-top: 1px solid var(--vt-line-dark); }
.vt-tickets__item:last-child { border-bottom: 1px solid var(--vt-line-dark); }

.vt-tickets__link {
	display: grid;
	grid-template-columns: 3.5rem 1fr auto auto;
	align-items: center;
	gap: .9rem;
	/* Comfortably over the 44px tap minimum on the smallest phone. */
	min-height: 4.5rem;
	padding: .7rem .15rem;
	color: #fff; text-decoration: none;
	transition: background var(--vt-dur) var(--vt-ease);
}
.vt-tickets__link:hover,
.vt-tickets__link:focus-visible { background: rgba(255, 255, 255, .07); }

.vt-tickets__thumb {
	width: 3.5rem; height: 3.5rem; border-radius: var(--vt-r-sm);
	overflow: hidden; background: rgba(255, 255, 255, .09); flex: none;
}
.vt-tickets__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.vt-tickets__body { min-width: 0; }
.vt-tickets__name {
	display: block; font-size: 1rem; font-weight: 500; line-height: 1.25;
	/* Long names must wrap, never push the price off a 320px screen. */
	overflow-wrap: anywhere;
}
.vt-tickets__meta { display: block; margin-top: .12rem; font-size: .78rem; color: rgba(255, 255, 255, .58); }

.vt-tickets__price { text-align: right; line-height: 1.15; white-space: nowrap; }
.vt-tickets__price small { display: block; font-size: .66rem; color: rgba(255, 255, 255, .55); }
.vt-tickets__price b { font-size: .98rem; font-weight: 600; }

.vt-tickets__go { color: rgba(255, 255, 255, .5); display: flex; }

.vt-tickets__foot { margin: var(--vt-sp-4) 0 0; }
.vt-tickets__foot a { color: rgba(255, 255, 255, .74); font-size: .92rem; }
.vt-tickets__foot a:hover { color: #fff; }

@media (min-width: 640px) {
	.vt-tickets__close span { display: inline; }
	.vt-tickets__link {
		grid-template-columns: 4.5rem 1fr auto auto;
		gap: 1.15rem;
		min-height: 5.25rem;
	}
	.vt-tickets__thumb { width: 4.5rem; height: 4.5rem; }
	.vt-tickets__name { font-size: 1.1rem; }
	.vt-tickets__price b { font-size: 1.05rem; }
}

@media (min-width: 1024px) {
	.vt-tickets__link { min-height: 5.75rem; }
	.vt-tickets__name { font-size: 1.2rem; }
	/* Without a cap the price drifts to the far edge of a 1440px screen and
	   stops reading as part of the row it belongs to. */
	.vt-tickets__list,
	.vt-tickets__foot { max-width: 58rem; }
}

@media (prefers-reduced-motion: reduce) {
	.vt-tickets { transition: none; }
	.vt-tickets__link { transition: none; }
}

/* ---------------------------------------------------------------------------
   Touch targets and legibility
   Audited in headless Chrome at 320 / 390 / 768 / 1440. No page scrolls
   sideways at any width; these are the tap targets that came back under 44px
   and the one text style under 12px.
   --------------------------------------------------------------------------- */

/* The primary conversion button was 40px tall — below the 44px minimum on the
   one control the whole site funnels towards. */
.vt-header__cta,
.vt-btn--sm { min-height: var(--vt-tap); }

/* Logo link: 36–40px. It is the second-most-tapped thing on a phone. */
.vt-brand { min-height: var(--vt-tap); display: inline-flex; align-items: center; }

/* Footer link lists and breadcrumbs ran at 22px line boxes — legible, but a
   miss on a moving tram. Padding grows the hit area without moving anything
   visually apart on desktop. */
/* 36px clears WCAG 2.2's 24px minimum comfortably. Primary controls — the CTA,
   buttons and the ticket picker rows — are all 44px+; inflating every secondary
   footer link to 44 would add ~300px of footer on a phone for no real gain. */
.vt-footer__grid ul li a,
.vt-footer__bottom a,
.vt-footer__legal-body a,
.vt-book-card__terms a,
.vt-breadcrumbs a,
.vt-breadcrumbs span { display: inline-flex; align-items: center; min-height: 2.25rem; }

@media (min-width: 1024px) {
	/* Pointer devices do not need the extra height, and it loosens the footer. */
	.vt-footer__grid ul li a,
	.vt-footer__bottom a,
	.vt-footer__legal-body a,
	.vt-book-card__terms a,
	.vt-breadcrumbs a,
	.vt-breadcrumbs span { min-height: 0; }
}

/* The non-refundable tooltip trigger was 20px tall. */
.vt-tip__btn { min-height: var(--vt-tap); }

/* "from" was rendering at 10.56px — under the 12px floor, and it sits next to
   the price, which is exactly the text a visitor squints at. */
.vt-price small,
.vt-card__price small,
.vt-tickets__price small { font-size: .75rem; }

/* Only visible on focus, but it is the first thing a keyboard or screen-reader
   user meets. */
.skip-link:focus { min-height: var(--vt-tap); display: inline-flex; align-items: center; }

/* Gallery credit. Sits inside the figure, over the foot of the image, so an
   attribution licence is satisfied where the photograph actually appears. */
.vt-gallery__item { position: relative; }

.vt-gallery__credit {
	position: absolute; left: 0; right: 0; bottom: 0;
	margin: 0;
	padding: 1.4rem .55rem .4rem;
	font-size: .62rem; line-height: 1.25;
	color: rgba(255, 255, 255, .82);
	background: linear-gradient(to top, rgba(0, 0, 0, .62), rgba(0, 0, 0, 0));
	text-align: right;
	pointer-events: none;
}

.vt-gallery__credit a { color: inherit; text-decoration: underline; pointer-events: auto; }
.vt-gallery__credit a:hover { color: #fff; }

/* The booking form lives inside the sticky card, with LatePoint's side panel and
   running summary both switched off — those are what need width, and the column
   does not have it. What is left is a single-column flow: service, date, time,
   details. It must be free to size to the card, so nothing here sets a width. */
.vt-book-card { scroll-margin-top: calc(var(--vt-header-h) + 1rem); }
.vt-book-card:focus { outline: none; }

.vt-booking-slot .latepoint-book-form-wrapper,
.vt-booking-slot .latepoint-w,
.vt-booking-slot .latepoint-booking-form-element,
.vt-booking-slot .latepoint-form-w {
	max-width: 100%;
	min-width: 0;
}

/* LatePoint sizes some inner steps in fixed pixels; let them wrap rather than
   push the card sideways and give the whole page a horizontal scrollbar. */
.vt-booking-slot { overflow-x: clip; }
.vt-booking-slot .latepoint-side-panel { display: none; }

/* Booking card head + notice.
   The price moved out of this box — it still leads the hero CTA and the mobile
   bar, so repeating it here said nothing new. What the card needed to say is
   what it is for. */
.vt-book-card__lead {
	margin: 0;
	font-family: var(--vt-sans);
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--vt-green-deep);
}

.vt-book-notice {
	display: flex;
	align-items: flex-start;
	gap: .6rem;
	margin: 0 0 var(--vt-sp-3);
	padding: .75rem .85rem;
	border-radius: var(--vt-r);
	background: var(--vt-panel-3);
	color: var(--vt-ink);
	font-size: .85rem;
	line-height: 1.45;
}

.vt-book-notice__icon {
	flex: none;
	display: flex;
	margin-top: .08rem;
	color: var(--vt-violet);
}

/* ---------------------------------------------------------------------------
   Mobile header fit
   Under 768px the header CTA collapses to an icon-only pill (its label is
   visually hidden until the 768px breakpoint), which left a wide empty button
   crowding the brand, language picker and menu toggle onto one row.
   Tighten the button, size the icon so it actually reads, and cap the logo.
   min-height: var(--vt-tap) from the touch-target block above still applies,
   so the 44px tap target is unchanged.
   --------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.vt-brand__logo { max-width: 100px; }
	.vt-btn--sm { padding: 5px 10px; }
	.vt-btn svg { width: 30px; height: 30px; }
}
