/*
Theme Name: Argentina Tango
Theme URI: https://argentinatango.com
Author: Argentina Tango
Author URI: https://argentinatango.com
Description: A custom Classic WordPress theme for Argentina Tango, a Buenos Aires tango tour and travel operator. Provides a Tour Package custom post type, native Posts for the blog, and flexible page templates for a fully editable site.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: argentina-tango
Tags: custom-menu, custom-logo, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* -----------------------------------------------------------------------
   1. Design tokens
   ----------------------------------------------------------------------- */
:root {
	/* Masthead geometry: the logo row, plus the Tango Experience strip
	   that sits under it below 1280px. Page heroes pad down by the sum so
	   their titles clear the transparent masthead floating over them. */
	--masthead-row: 96px;
	--header-promo-h: 0px;
	--masthead-h: calc(var(--masthead-row) + var(--header-promo-h));

	/* The client's actual brand blue (#017ABE, pulled from the live site's
	   own CSS) restored as primary after the wine-red palette read as an
	   unwanted departure rather than an upgrade - deepened slightly here for
	   AA text contrast on white. Paired the way Tully/Ritz-Carlton Yacht
	   Collection/Blair Spangler actually pair a "travel" blue: a near-navy
	   dark surface (their own #0a2540, used for the footer/overlays instead
	   of flat black), warm brass/gold for hairline dividers and eyebrows
	   (Blair's signature move), and warm ivory instead of stark white. Warm
	   terracotta stays as a minor secondary accent (badges/borders only) -
	   tango's own warmth against the cooler navy-and-brass luxury palette. */
	--color-primary: #0a6386;
	--color-primary-deep: #073e58;
	/* Button and panel fills (client: the bright blue buttons and boxes
	   felt "corporate rather than luxury"). Deep ink, turning brass on
	   hover - the brand blue stays for links and small accents. */
	--color-cta: #0e1c29;
	--color-cta-text: #ffffff;
	--color-cta-hover: #a88a55;
	--color-cta-hover-text: #0e1c29;
	--color-navy: #0e1c29;
	--color-navy-deep: #09131c;
	--color-heading: #0e1c29;
	--color-text: #3a4247;
	--color-muted: #6f777c;
	--color-white: #ffffff;
	--color-light-bg: #f1eee9;
	--color-offwhite: #ffffff;
	--color-accent: #0a6386;
	--color-gold: #a88a55;
	--color-gold-soft: #efe8dc;
	--color-sunset: #b8704e;
	--color-sunset-soft: #f6ece5;
	--color-border: #e4dfd7;
	--color-overlay: rgba(9, 19, 28, 0.55);

	/* Measured from the reference sites themselves, not guessed: Tully runs
	   IvyPresto Display at weight 300, Sowk runs Cormorant Garamond 500,
	   Ritz-Carlton runs Caslon at 400 - a classical serif at light/regular
	   weight, never bold. Playfair at 600-700 was the "heavy blog template"
	   tell. Cormorant Garamond is Sowk's own face and the closest free
	   match to IvyPresto. Jost carries body/UI (Tully and Sowk both pair
	   their serif with a quiet geometric sans). --font-accent now points at
	   Jost too, so the site runs on exactly two families. */
	--font-heading: "Cormorant Garamond", "Cormorant", Georgia, serif;
	--font-body: "Jost", -apple-system, BlinkMacSystemFont, sans-serif;
	--font-accent: "Jost", -apple-system, BlinkMacSystemFont, sans-serif;

	--container-max: 1240px;
	/* Tully Luxury Travel rhythm (measured 2026-10-05 via CDP at 1440px): most
	   sections run 48px top and bottom, so content-to-content gaps land near
	   96px; only feature bands (dark panels, closing CTA) go to 96-120px.
	   The old 80-140px per side left 160-280px holes between sections. */
	--section-space: clamp(32px, 3.4vw, 48px);
	--section-space-lg: clamp(56px, 5.6vw, 80px);
	/* Square corners throughout - all four references use them on images,
	   cards, buttons and inputs alike. */
	--radius-sm: 0;
	--radius-md: 0;
	--radius-pill: 0;
}

/* -----------------------------------------------------------------------
   2. Reset & base
   ----------------------------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.75;
	color: var(--color-text);
	background: var(--color-white);
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: opacity 0.2s ease;
}

a:hover,
a:focus {
	opacity: 0.8;
}

/* Cormorant has a small x-height, so its sizes sit a step above what a
   Playfair scale would use; weight stays at 400-500 (the references never
   bold their display serif). */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	color: var(--color-heading);
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: 0.005em;
	margin: 0 0 20px;
}

h1, h2, h3 {
	text-wrap: balance;
}

h1 { font-size: clamp(40px, 5vw, 64px); line-height: 1.08; }
h2 { font-size: clamp(34px, 3.6vw, 50px); line-height: 1.1; }
h3 { font-size: 28px; }
h4 { font-size: 24px; }
h5 { font-size: 21px; }
h6 { font-size: 18px; }

p {
	margin: 0 0 20px;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.container {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: 0 20px;
}

.screen-reader-text,
.skip-link {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.skip-link:focus {
	position: fixed;
	top: 10px;
	left: 10px;
	width: auto;
	height: auto;
	padding: 12px 20px;
	background: var(--color-cta);
	color: var(--color-white);
	z-index: 10000;
	border-radius: var(--radius-sm);
}

/* No rule under every heading any more: on every reference site the
   heading itself (large, light serif, generous space around it) is the
   whole statement. A hairline under each one read as template chrome. */
.section-heading {
	text-align: center;
	margin-bottom: 36px;
}

.section-cta {
	text-align: center;
	margin-top: 30px;
}

/* -----------------------------------------------------------------------
   3. Buttons
   ----------------------------------------------------------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: var(--color-cta-text);
	background: var(--color-cta);
	border: 1px solid var(--color-cta);
	border-radius: 0;
	padding: 16px 36px;
	cursor: pointer;
	line-height: 1.4;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

/* Buttons are words, not words plus an arrow glyph - drop the Font Awesome
   arrows templates append (they read as generic "SaaS CTA" chrome). */
.btn .fa-arrow-right,
.btn .fa-long-arrow-alt-right {
	display: none;
}

.btn:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 3px;
}

.btn:hover,
.btn:focus {
	background: var(--color-cta-hover);
	border-color: var(--color-cta-hover);
	color: var(--color-cta-hover-text);
}

.btn-outline {
	background: transparent;
	color: var(--color-heading);
	border-color: rgba(14, 28, 41, 0.55);
}

.btn-outline:hover,
.btn-outline:focus {
	background: var(--color-cta);
	border-color: var(--color-cta);
	color: var(--color-white);
}

.btn-large {
	font-size: 12px;
	padding: 19px 44px;
}

/* For use over photography and on ink bands. */
.btn-light {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-heading);
}

.btn-light:hover,
.btn-light:focus {
	background: transparent;
	border-color: var(--color-white);
	color: var(--color-white);
}

.btn-ghost-light {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.7);
	color: var(--color-white);
}

.btn-ghost-light:hover,
.btn-ghost-light:focus {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-heading);
}

/* Quiet underlined text link - Ritz-Carlton's "Learn more" treatment, used
   where a second full button would compete with the first. */
.text-link {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-heading);
	padding-bottom: 6px;
	border-bottom: 1px solid currentColor;
}

.text-link:hover,
.text-link:focus {
	opacity: 1;
	color: var(--color-gold);
}

/* Buttons authored through the block editor (Buttons/Button blocks) get
   the same look as .btn, keyed off the "Additional CSS Class" the editor
   sets on the block (e.g. "btn-primary", "btn-outline-light"). */
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: var(--color-cta-text);
	background: var(--color-cta);
	border: 1px solid var(--color-cta);
	border-radius: 0;
	padding: 16px 36px;
	line-height: 1.4;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus {
	background: var(--color-cta-hover);
	border-color: var(--color-cta-hover);
	color: var(--color-cta-hover-text);
}

.wp-block-button.btn-outline-light .wp-block-button__link {
	background: transparent;
	color: var(--color-white);
	border-color: rgba(255, 255, 255, 0.6);
}

.wp-block-button.btn-outline-light .wp-block-button__link:hover {
	color: var(--color-white);
}

/* -----------------------------------------------------------------------
   4. Header
   ----------------------------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 999;
	background: var(--color-white);
	border-bottom: 1px solid var(--color-border);
	transition: background-color 0.35s ease, border-color 0.35s ease, color 0.35s ease;
}

/* One row: menu + phone | centred logo | language + contact. The two outer
   columns share the leftover width equally, so the logo sits on the true
   centre line whatever the side groups contain. */
.site-header-inner {
	max-width: 1600px;
	margin: 0 auto;
	padding: 0 40px;
	min-height: calc(var(--masthead-row) + var(--header-promo-h));
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	grid-template-areas: "menu brand tools";
	align-items: center;
	column-gap: 24px;
	transition: min-height 0.35s ease;
}

.header-left {
	grid-area: menu;
	justify-self: start;
	display: flex;
	align-items: center;
	gap: 28px;
}

/* Short-stay prompt beside the menu button: a small caps eyebrow over the
   Tango Experience link, in the slot the phone number used to fill. */
.header-promo {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding-left: 28px;
	border-left: 1px solid var(--color-border);
	line-height: 1.25;
	color: var(--color-heading);
	text-decoration: none;
	transition: border-color 0.35s ease, color 0.35s ease;
}

.header-promo-eyebrow {
	font-size: 10.5px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	opacity: 0.7;
}

.header-promo-title {
	font-family: var(--font-heading);
	font-size: 19px;
	font-style: italic;
	white-space: nowrap;
}

.header-promo-title i {
	margin-left: 4px;
	font-size: 10px;
	vertical-align: 2px;
	transition: transform 0.25s ease;
}

.header-promo:hover .header-promo-title i,
.header-promo:focus-visible .header-promo-title i {
	transform: translateX(4px);
}

.header-promo-raquo {
	display: inline-block;
	margin-left: 2px;
	font-style: normal;
	transition: transform 0.25s ease;
}

.header-promo:hover .header-promo-raquo,
.header-promo:focus-visible .header-promo-raquo {
	transform: translateX(4px);
}

/* Below 1280px the side columns are too narrow for the full prompt, so it
   becomes a slim centred strip under the logo row - still on every page,
   iPad and phone included (client: it only showed "Tango Experience", or
   nothing at all, on tablets and phones). The inner row reserves the
   strip's height with padding so the masthead's backdrop covers it. */
@media (max-width: 1279px) {
	:root {
		--header-promo-h: 40px;
	}

	.site-header-inner {
		position: relative;
		padding-bottom: var(--header-promo-h);
	}

	.header-promo {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: var(--header-promo-h);
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
		align-items: baseline;
		justify-content: center;
		column-gap: 14px;
		row-gap: 0;
		padding: 0 16px;
		border-left: none;
		border-top: 1px solid var(--color-border);
		text-align: center;
	}

	.has-overlay-header .site-header:not(.is-scrolled) .header-promo {
		border-top-color: rgba(255, 255, 255, 0.16);
	}

	.header-promo-title {
		font-size: 17px;
	}
}

@media (max-width: 599px) {
	:root {
		--header-promo-h: 50px;
	}

	.header-promo {
		flex-direction: column;
		align-items: center;
	}

	.header-promo-eyebrow {
		font-size: 9.5px;
		letter-spacing: 0.14em;
	}

	.header-promo-title {
		font-size: 16px;
	}
}

.site-branding {
	grid-area: brand;
	padding: 16px 0;
}

.site-branding img,
.custom-logo {
	width: 190px;
	height: auto;
	transition: filter 0.35s ease, width 0.35s ease;
}

.header-cta {
	grid-area: tools;
	justify-self: end;
	display: flex;
	align-items: center;
	gap: 18px;
}

.header-cta .btn {
	padding: 12px 26px;
}

.lang-switcher {
	position: relative;
}

.lang-switcher-toggle {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 0;
	border: none;
	background: transparent;
	color: var(--color-heading);
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.12em;
	cursor: pointer;
	transition: color 0.15s ease;
}

.lang-switcher-toggle:hover {
	color: var(--color-primary);
}

.lang-switcher-toggle .fa-globe {
	display: none;
}

.lang-switcher-caret {
	font-size: 8px;
	transition: transform 0.15s ease;
}

.lang-switcher.is-open .lang-switcher-caret {
	transform: rotate(180deg);
}

.lang-switcher-menu {
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	min-width: 170px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	box-shadow: 0 18px 40px rgba(9, 19, 28, 0.12);
	list-style: none;
	margin: 0;
	padding: 8px 0;
	display: none;
	z-index: 100;
}

.lang-switcher.is-open .lang-switcher-menu {
	display: block;
}

.lang-switcher-menu button {
	display: block;
	width: 100%;
	text-align: left;
	padding: 9px 18px;
	border: none;
	background: none;
	font-family: var(--font-body);
	font-size: 14px;
	color: var(--color-heading);
	cursor: pointer;
}

.lang-switcher-menu button:hover {
	background: var(--color-light-bg);
	color: var(--color-primary);
}

#google_translate_element,
.goog-te-banner-frame,
.skiptranslate {
	display: none !important;
}

body {
	top: 0 !important;
}

.theme-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 1px solid transparent;
	background: transparent;
	color: var(--color-heading);
	font-size: 12px;
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.theme-toggle:hover {
	border-color: currentColor;
}

.theme-toggle-icon-light {
	display: none;
}

[data-theme="dark"] .theme-toggle-icon-dark {
	display: none;
}

[data-theme="dark"] .theme-toggle-icon-light {
	display: inline;
}

/* Menu button: three hairlines and the word "Menu", which turn into a cross
   and "Close" while the overlay is open. It sits above the overlay so the
   same button closes it. */
.menu-toggle {
	position: relative;
	z-index: 1001;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 0;
	background: none;
	border: none;
	color: var(--color-heading);
	font-family: var(--font-body);
	font-size: 14px;
	letter-spacing: 0.04em;
	cursor: pointer;
	transition: color 0.35s ease;
}

.menu-toggle-icon {
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 26px;
}

.menu-toggle-bar {
	width: 100%;
	height: 1px;
	background: currentColor;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.menu-toggle-label--close,
.nav-open .menu-toggle-label--open {
	display: none;
}

.nav-open .menu-toggle-label--close {
	display: inline;
}

.main-navigation.nav-open .menu-toggle {
	color: var(--color-white);
}

.main-navigation.nav-open .menu-toggle-bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.main-navigation.nav-open .menu-toggle-bar:nth-child(2) {
	opacity: 0;
}

.main-navigation.nav-open .menu-toggle-bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* Menu: the client liked the menu's content and asked for the Sowk Concept
   presentation (sowkconcept.com/book-stay) - a panel that slides in from
   the left while the current page stays visible, dimmed, beside it. The
   panel holds the same nine sections in the display serif, each folding out
   to its packages, plus a photograph (a different one each time it opens -
   see theme.js) and direct contact details. Clicking the dimmed page closes
   it. */
.nav-overlay {
	position: fixed;
	inset: 0;
	z-index: 1000;
	background: rgba(9, 19, 28, 0.55);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	color: var(--color-white);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.45s ease, visibility 0.45s;
}

.main-navigation.nav-open .nav-overlay {
	opacity: 1;
	visibility: visible;
}

.main-navigation.nav-open .nav-overlay-inner {
	transform: translateX(0);
}

@media (prefers-reduced-motion: reduce) {
	.nav-overlay-inner {
		transition: none;
	}
}

.admin-bar .nav-overlay {
	top: 32px;
}

/* Scroll is locked on <body>, not <html>: overflow:hidden on the root
   element unpins the sticky masthead (it jumps back to the top of the
   document), which took the Close button out of view on scrolled pages. */
html.nav-locked body {
	overflow: hidden;
}

@media (max-width: 782px) {
	.admin-bar .nav-overlay {
		top: 46px;
	}
}

/* While the overlay is open the logo stays in place above it, in white. */
.nav-locked .site-branding {
	position: relative;
	z-index: 1001;
}

.nav-locked .site-branding img,
.nav-locked .custom-logo {
	filter: brightness(0) invert(1);
}

.nav-overlay-inner {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: min(1060px, 78vw);
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--color-navy-deep);
	box-shadow: 30px 0 80px rgba(0, 0, 0, 0.25);
	transform: translateX(-100%);
	transition: transform 0.6s cubic-bezier(0.22, 0.7, 0.18, 1);
	padding: 150px clamp(32px, 4vw, 64px) 72px;
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
	gap: clamp(48px, 8vw, 128px);
	align-items: start;
}

.primary-menu {
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.primary-menu > li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.primary-menu > li > a {
	padding: 15px 0;
	font-family: var(--font-heading);
	font-size: clamp(26px, 2.5vw, 34px);
	font-weight: 400;
	line-height: 1.2;
	color: var(--color-white);
	transition: color 0.2s ease, padding-left 0.3s ease;
}

.primary-menu > li > a:hover,
.primary-menu > li > a:focus-visible {
	color: var(--color-gold);
	padding-left: 10px;
}

.primary-menu > li.current-menu-item > a,
.primary-menu > li.current-menu-ancestor > a {
	color: var(--color-gold);
}

.submenu-indicator {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.22);
	color: var(--color-white);
	font-size: 10px;
	cursor: pointer;
	transition: border-color 0.2s ease, transform 0.3s ease;
}

.submenu-indicator:hover,
.submenu-indicator:focus-visible {
	border-color: var(--color-white);
}

.submenu-open > .submenu-indicator {
	transform: rotate(180deg);
}

.primary-menu .sub-menu {
	grid-column: 1 / -1;
	display: none;
	columns: 2;
	column-gap: 40px;
	padding: 0 0 22px;
}

.primary-menu .submenu-open > .sub-menu {
	display: block;
}

.primary-menu .sub-menu li {
	break-inside: avoid;
}

.primary-menu .sub-menu a {
	display: block;
	padding: 7px 0;
	font-size: 14px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.7);
}

.primary-menu .sub-menu a:hover,
.primary-menu .sub-menu a:focus-visible,
.primary-menu .sub-menu .current-menu-item > a {
	color: var(--color-white);
}

.nav-overlay-aside {
	padding-top: 6px;
}

/* Short-stay prompt at the top of the menu, phones and tablets only (the
   desktop masthead carries it beside the menu button). */
.nav-overlay-promo {
	display: none;
}

@media (max-width: 1024px) {
	.nav-overlay-promo {
		display: block;
		padding: 0 0 22px;
		border-bottom: 1px solid rgba(255, 255, 255, 0.16);
		font-family: var(--font-heading);
		font-size: 22px;
		font-style: italic;
		line-height: 1.3;
		color: var(--color-white);
	}

	.nav-overlay-promo > span:first-child {
		display: block;
		margin-bottom: 4px;
		font-family: var(--font-body);
		font-size: 10.5px;
		font-style: normal;
		font-weight: 500;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: rgba(255, 255, 255, 0.65);
	}

	.nav-overlay-promo i {
		margin-left: 4px;
		font-size: 12px;
	}
}

.nav-overlay-image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	margin-bottom: 32px;
	background: var(--color-navy);
	transition: opacity 0.6s ease;
}

.nav-overlay-image.is-loading {
	opacity: 0;
}

.nav-overlay-heading {
	margin: 0 0 12px;
	font-family: var(--font-heading);
	font-size: 26px;
	line-height: 1.25;
	color: var(--color-white);
}

.nav-overlay-contact {
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
}

.nav-overlay-contact a {
	display: inline-block;
	padding: 3px 0;
	font-size: 15px;
	color: rgba(255, 255, 255, 0.75);
}

.nav-overlay-contact a:hover {
	color: var(--color-white);
}

/* Homepage: the masthead floats transparent over the full-bleed hero with
   white type and a white logo, then settles into the solid white version
   once the visitor scrolls (theme.js adds .is-scrolled). */
.has-overlay-header .site-header {
	position: fixed;
	left: 0;
	right: 0;
	background: transparent;
	border-bottom-color: rgba(255, 255, 255, 0.18);
}

/* While it floats over the slider the masthead is a smoky band, as on the
   Ritz-Carlton Yacht Collection: dark enough for the white type to read,
   light enough that the photograph still shows through. It only turns
   solid white once the visitor has scrolled past the slider (theme.js).
   The blur sits on a pseudo-element: backdrop-filter on the header itself
   would make it the containing block for the fixed full-screen menu and
   clip the menu to the header's height. */
.has-overlay-header .site-header:not(.is-scrolled)::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(9, 19, 28, 0.62) 0%, rgba(9, 19, 28, 0.38) 100%);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	pointer-events: none;
}

/* Safari's rubber-band bounce at the top of the page reveals the canvas
   behind <body>; on the homepage paint it the hero's ink rather than white
   so the overscroll reads as part of the slider. */
html:has(> body.home) {
	background-color: var(--color-navy);
}

.admin-bar.has-overlay-header .site-header {
	top: 32px;
}

.has-overlay-header .site-header:not(.is-scrolled) .header-promo,
.has-overlay-header .site-header:not(.is-scrolled) .lang-switcher-toggle,
.has-overlay-header .site-header:not(.is-scrolled) .theme-toggle,
.has-overlay-header .site-header:not(.is-scrolled) .menu-toggle {
	color: var(--color-white);
}

.has-overlay-header .site-header:not(.is-scrolled) .header-promo {
	border-left-color: rgba(255, 255, 255, 0.3);
}

.has-overlay-header .site-header:not(.is-scrolled) .site-branding img,
.has-overlay-header .site-header:not(.is-scrolled) .custom-logo {
	filter: brightness(0) invert(1);
}

.has-overlay-header .site-header:not(.is-scrolled) .header-enquire {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.75);
	color: var(--color-white);
}

.has-overlay-header .site-header:not(.is-scrolled) .header-enquire:hover,
.has-overlay-header .site-header:not(.is-scrolled) .header-enquire:focus {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-heading);
}

.has-overlay-header .site-header.is-scrolled {
	background: var(--color-white);
	border-bottom-color: var(--color-border);
}

/* Once scrolled, the masthead compacts so the sticky bar takes less of the
   screen. */
@media (min-width: 1025px) {
	.site-header.is-scrolled .site-header-inner {
		min-height: calc(72px + var(--header-promo-h));
	}

	.site-header.is-scrolled .site-branding {
		padding: 10px 0;
	}

	.site-header.is-scrolled .site-branding img,
	.site-header.is-scrolled .custom-logo {
		width: 150px;
	}
}

/* -----------------------------------------------------------------------
   5. Hero bands (page-hero, home-hero)
   ----------------------------------------------------------------------- */
/* Interior page opening band: a tall photograph under an ink scrim with
   the page title set large in the light serif - the same opening move as
   the homepage, scaled down. */
.page-hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(340px, 42vw, 520px);
	background: var(--color-navy) var(--page-hero-image, none) center/cover no-repeat;
	color: var(--color-white);
	text-align: center;
	padding: 100px 20px;
}

.page-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(9, 19, 28, 0.35) 0%, rgba(9, 19, 28, 0.62) 100%);
}

.page-hero-inner {
	position: relative;
	z-index: 1;
	max-width: 860px;
	margin: 0 auto;
}

.page-hero-title {
	color: var(--color-white);
	font-weight: 400;
	font-size: clamp(40px, 5.2vw, 72px);
	line-height: 1.05;
	margin-bottom: 18px;
}

.page-hero--compact {
	min-height: 0;
	padding: 70px 20px;
	text-align: left;
}

.page-hero--compact .page-hero-inner {
	width: 100%;
}

.page-hero--compact .page-hero-inner {
	max-width: var(--container-max);
	margin: 0 auto;
}

.page-hero--compact .page-hero-title {
	margin-bottom: 0;
}

.page-hero--compact .page-hero-subtitle {
	margin: 14px 0 0;
}

.page-hero-subtitle {
	font-size: 17px;
	font-weight: 300;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.88);
	max-width: 620px;
	margin: 0 auto 28px;
}

/* With the masthead floating transparent over every page's opening photo
   (.has-overlay-header, inc/setup.php), the band runs up under it and
   grows by the masthead's height so the title keeps its breathing room. */
.has-overlay-header .site-main > .page-hero:first-of-type {
	min-height: calc(clamp(340px, 42vw, 520px) + var(--masthead-h));
	padding-top: calc(100px + var(--masthead-h));
}

.has-overlay-header .site-main > .page-hero--compact:first-of-type {
	min-height: 0;
	padding-top: calc(70px + var(--masthead-h));
}

.has-overlay-header .site-main > .contact-hero:first-of-type {
	height: calc(340px + var(--masthead-h));
}

@media (max-width: 767px) {
	.has-overlay-header .site-main > .page-hero:first-of-type {
		padding-top: calc(70px + var(--masthead-h));
	}
}

/* Homepage hero: full-bleed, full-height tango photography behind a large
   light serif headline - the opening move shared by Tully, Sowk, Blair
   Spangler and Ritz-Carlton. The masthead floats over it (see .home
   .site-header), and the search bar docks flush against its bottom edge. */
.home-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 100vh;
	min-height: 100svh;
	background: var(--color-navy);
	color: var(--color-white);
	overflow: hidden;
	isolation: isolate;
}

.home-hero-slides {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.home-hero-slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center 35%;
	opacity: 0;
	transition: opacity 2s ease;
}

.home-hero-slide.is-active {
	opacity: 1;
	animation: home-hero-ken-burns 9s ease-out forwards;
}

/* A slow, subtle zoom on the active slide - a video-like sense of motion
   from real photography, without an actual video file (see theme.js for
   the slide-cycling this pairs with). */
@keyframes home-hero-ken-burns {
	from { transform: scale(1); }
	to   { transform: scale(1.07); }
}

@media (prefers-reduced-motion: reduce) {
	.home-hero-slide.is-active {
		animation: none;
	}
}

/* Darkens the top (so the white masthead reads) and the foot (so the
   search bar reads), with an even wash through the middle for the centred
   headline. */
.home-hero-scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(180deg, rgba(9, 19, 28, 0.45) 0%, rgba(9, 19, 28, 0.3) 24%, rgba(9, 19, 28, 0.34) 62%, rgba(9, 19, 28, 0.6) 100%);
}

/* Headline centred in the frame, as on Tully and Blair Spangler: one line
   of place, the title, one quiet button. The longer welcome paragraph is
   kept in the content but not shown here - the intro section below says
   the same thing at reading size. */
.home-hero-inner {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding-top: 140px;
	padding-bottom: 72px;
	text-align: center;
}

.home-hero-text {
	max-width: 980px;
}

.home-hero-eyebrow {
	margin: 0 0 24px;
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.85);
}

.home-hero-title {
	color: var(--color-white);
	font-weight: 400;
	font-size: clamp(46px, 6vw, 92px);
	line-height: 1.02;
	letter-spacing: -0.005em;
	margin: 0 auto 44px;
	text-wrap: balance;
}

.home-hero-subtitle {
	display: none;
	font-size: 17px;
	font-weight: 300;
	line-height: 1.75;
	color: rgba(255, 255, 255, 0.88);
	margin-bottom: 40px;
	max-width: 540px;
}

/* The block-editor "Book Now" button in the hero content, restyled for a
   photograph: white, inverting to outline on hover. */
.home-hero-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}

.home-hero-actions .wp-block-button__link {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.8);
	color: var(--color-white);
}

.home-hero-actions .wp-block-button__link:hover,
.home-hero-actions .wp-block-button__link:focus {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-heading);
}

.home-hero-search-wrap {
	position: relative;
	width: 100%;
}

/* Discreet source credit for the hero photography, per the license terms
   for reusing this account's imagery - tucked into the slider's very
   bottom-right corner, beside the Search button (client request). */
.home-hero-photo-credit {
	position: absolute;
	right: 20px;
	bottom: calc(100% + 8px);
	z-index: 1;
	font-family: var(--font-body);
	font-size: 9.5px;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-align: right;
	color: rgba(255, 255, 255, 0.55);
	pointer-events: none;
}

/* Back / forward arrows directly under the credit: deliberately almost
   invisible (client: "really really tiny almost invisible") until hovered
   or focused. The buttons keep a finger-sized hit area; only the chevrons
   are small. The credit moves up one line to make room for them. */
.home-hero-arrows {
	position: absolute;
	right: 12px;
	bottom: calc(100% + 2px);
	z-index: 2;
	display: flex;
}

.home-hero-search-wrap .home-hero-photo-credit {
	bottom: calc(100% + 32px);
}

.home-hero-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	background: none;
	border: none;
	color: rgba(255, 255, 255, 0.38);
	font-size: 9px;
	cursor: pointer;
	transition: color 0.25s ease;
}

.home-hero-arrow:hover,
.home-hero-arrow:focus-visible {
	color: rgba(255, 255, 255, 0.95);
}

/* Wide screens have a margin beside the search bar: the credit drops into
   the slider's bottom-right corner, next to the Search button. */
@media (min-width: 1400px) {
	.home-hero-search-wrap .home-hero-photo-credit {
		right: calc((100% - 100vw) / 2 + 12px);
		bottom: 34px;
		max-width: calc((100vw - 100%) / 2 - 24px);
	}

	.home-hero-arrows {
		right: calc((100% - 100vw) / 2 + 4px);
		bottom: 4px;
	}
}

/* Frosted ink glass bar docked on the hero's bottom edge. color-scheme:
   dark makes the native select/date pickers open dark to match. */
.home-hero-search {
	display: flex;
	align-items: stretch;
	background: rgba(9, 19, 28, 0.38);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-bottom: none;
	color-scheme: dark;
}

.home-hero-search-field {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
	padding: 22px 28px;
	border-right: 1px solid rgba(255, 255, 255, 0.14);
	min-width: 0;
}

.home-hero-search-field--package {
	flex-grow: 1.5;
}

.home-hero-search-field--travelers {
	flex-grow: 0.55;
}

.home-hero-search-field label {
	display: block;
	font-size: 10.5px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: rgba(255, 255, 255, 0.8);
}

.home-hero-search-field select,
.home-hero-search-field input {
	display: block;
	width: 100%;
	border: none;
	padding: 0;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 400;
	color: var(--color-white);
	background: transparent;
	cursor: pointer;
}

.home-hero-search-field select option,
.home-hero-search-field select optgroup {
	color: var(--color-heading);
	background: var(--color-white);
}

.home-hero-search-field select:focus-visible,
.home-hero-search-field input:focus-visible {
	outline: 1px solid rgba(255, 255, 255, 0.7);
	outline-offset: 4px;
}

.home-hero-search-date-inputs {
	display: flex;
	align-items: center;
	gap: 8px;
}

.home-hero-search-date-inputs span {
	color: rgba(255, 255, 255, 0.5);
	flex-shrink: 0;
}

.home-hero-search-date-inputs input {
	width: 100%;
	font-size: 14px;
}

.home-hero-search-submit {
	flex-shrink: 0;
	padding: 0 48px;
}

@media (max-width: 900px) {
	.home-hero-inner {
		padding-top: 150px;
		padding-bottom: 40px;
	}

	.home-hero-search {
		flex-direction: column;
	}

	.home-hero-search-field {
		border-right: none;
		border-bottom: 1px solid rgba(255, 255, 255, 0.14);
		padding: 16px 20px;
	}

	.home-hero-search-submit {
		width: 100%;
		padding: 18px 32px;
	}

	.home-hero-photo-credit {
		right: 16px;
	}

	.home-hero-arrows {
		right: 8px;
	}
}

@media (max-width: 767px) {
	.home-hero-title {
		font-size: 44px;
	}

	.home-hero-subtitle {
		font-size: 16px;
		margin-bottom: 32px;
	}

	.home-hero-search-wrap {
		padding: 0;
	}

	.home-hero-search {
		border-left: none;
		border-right: none;
	}
}

.breadcrumbs {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
}

.breadcrumbs a {
	color: rgba(255, 255, 255, 0.9);
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
}

.breadcrumbs .sep {
	margin: 0 6px;
}

/* -----------------------------------------------------------------------
   6. Homepage sections
   ----------------------------------------------------------------------- */
.home-intro,
.home-packages,
.home-blog {
	padding: var(--section-space) 0;
}

.home-packages {
	background: var(--color-light-bg);
}

/* -----------------------------------------------------------------------
   7. Card grids (packages, posts)
   ----------------------------------------------------------------------- */
.package-grid,
.post-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 56px 32px;
}

/* Image-first cards with no box, border or lift - the photograph and the
   serif title carry them, as on the reference sites. */
.package-card,
.post-card {
	background: none;
	overflow: hidden;
}

.package-card:hover,
.post-card:hover {
	opacity: 1;
}

.package-card-link,
.post-card-link {
	display: block;
	color: inherit;
}

.package-card-media,
.post-card-media {
	position: relative;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background: var(--color-light-bg);
}

.package-card-media img,
.post-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.package-card-link:hover .package-card-media img,
.post-card-link:hover .post-card-media img {
	transform: scale(1.04);
}

.package-card-duration {
	position: absolute;
	bottom: 10px;
	left: 10px;
	background: var(--color-accent);
	color: var(--color-white);
	font-size: 12px;
	font-weight: 600;
	padding: 4px 12px;
	border-radius: var(--radius-pill);
}

.post-card-category {
	position: absolute;
	top: 14px;
	left: 14px;
	background: var(--color-white);
	color: var(--color-heading);
	font-size: 10px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	padding: 6px 10px;
}

.blog-category-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 36px;
}

.blog-category-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 9px 16px;
	border: 1px solid var(--color-border);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: var(--color-heading);
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.blog-category-link span {
	opacity: 0.65;
	font-weight: 500;
}

.blog-category-link:hover,
.blog-category-link.is-active {
	background: var(--color-heading);
	border-color: var(--color-heading);
	color: var(--color-white);
}

.blog-category-link.is-active span,
.blog-category-link:hover span {
	opacity: 0.85;
}

@media (max-width: 600px) {
	.blog-category-nav {
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: 6px;
		margin-left: -20px;
		margin-right: -20px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.blog-category-link {
		flex-shrink: 0;
	}
}

.package-card-body,
.post-card-body {
	padding: 22px 0 0;
}

.package-card-title,
.post-card-title {
	font-size: 25px;
	font-weight: 500;
	line-height: 1.2;
	margin-bottom: 12px;
}

.package-card-excerpt,
.post-card-excerpt {
	font-size: 14.5px;
	line-height: 1.7;
	color: var(--color-muted);
	margin-bottom: 16px;
}

.post-card-cta {
	display: inline-block;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-heading);
	padding-bottom: 5px;
	border-bottom: 1px solid currentColor;
}

.package-card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 14px;
	font-weight: 600;
}

.package-card-price {
	color: var(--color-accent);
}

/* Art, Culture & Tango page: reuses .post-card/.post-grid (built for the
   blog) for a static, non-post topic grid, so it needs its own top margin
   and left alignment - .services-cards-section centers its heading text
   but the cards inside it should read left-aligned like the blog grid does. */
.culture-topic-grid {
	margin-top: 40px;
	text-align: left;
}

.culture-topic-card .post-card-media {
	position: relative;
}

.culture-dont-miss {
	max-width: 760px;
	margin: 40px auto 0;
	padding: 18px 26px;
	background: var(--color-light-bg);
	border-left: 3px solid var(--color-gold);
	border-radius: var(--radius-sm);
	text-align: left;
	font-size: 15px;
	line-height: 1.6;
}

.package-archive {
	padding-block: var(--section-space);
}

.package-archive-group + .package-archive-group {
	margin-top: 50px;
}

/* -----------------------------------------------------------------------
   8. Single Tour Package
   ----------------------------------------------------------------------- */
.package-single {
	padding: var(--section-space) 20px;
}

.package-includes,
.package-itinerary,
.package-book-cta {
	margin-bottom: 60px;
}

.package-includes-grid {
	display: grid;
	/* --cols: how many of Travel / Activities / Hotels / Meals the package has. */
	grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr));
	gap: 30px;
}

.package-includes-column {
	background: var(--color-light-bg);
	border-radius: var(--radius-md);
	padding: 30px;
}

.check-list li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 12px;
	font-size: 15px;
}

.check-list i {
	color: var(--color-primary);
	margin-top: 4px;
}

.package-itinerary-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}

.package-itinerary-day {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 24px;
}

.package-book-cta {
	text-align: center;
	background: var(--color-heading);
	color: var(--color-white);
	border-radius: var(--radius-md);
	padding: var(--section-space) 20px;
}

.package-book-cta .section-heading,
.package-book-cta h2 {
	color: var(--color-white);
}

.package-price {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 20px;
}

/* -----------------------------------------------------------------------
   9. Single blog post
   ----------------------------------------------------------------------- */
.single-post-layout {
	padding: var(--section-space) 20px;
	display: grid;
	grid-template-columns: minmax(0, 2.5fr) minmax(0, 1fr);
	gap: 50px;
	align-items: start;
}

.post-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	font-size: 14px;
	color: var(--color-primary);
	margin-bottom: 30px;
	font-weight: 500;
}

.post-meta a {
	color: inherit;
}

.entry-content {
	font-size: 16px;
	line-height: 1.8;
}

.entry-content h2,
.entry-content h3 {
	margin-top: 40px;
}

.post-tags {
	margin: 30px 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.post-tag {
	background: var(--color-light-bg);
	padding: 6px 16px;
	border-radius: var(--radius-pill);
	font-size: 13px;
}

.share-buttons {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 30px 0;
	padding: 20px 0;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}

.share-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 18px;
	border-radius: var(--radius-sm);
	color: var(--color-white);
	font-size: 14px;
	font-weight: 600;
}

.share-button--facebook {
	background: #3b5998;
}

.share-button--twitter {
	background: #1da1f2;
}

.share-button--linkedin {
	background: #0077b5;
}

.share-button:hover {
	opacity: 0.9;
}

.single-post-sidebar {
	background: var(--color-light-bg);
	border-radius: var(--radius-md);
	padding: 24px;
}

.sidebar-post-list {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.sidebar-post-list-item a {
	display: flex;
	align-items: center;
	gap: 14px;
}

.sidebar-post-thumb {
	flex-shrink: 0;
	width: 70px;
	height: 60px;
	border-radius: var(--radius-sm);
	overflow: hidden;
}

.sidebar-post-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sidebar-post-title {
	font-size: 14px;
	line-height: 1.5;
	color: var(--color-heading);
}

.sidebar-post-list-item a:hover .sidebar-post-title {
	color: var(--color-primary);
}

/* -----------------------------------------------------------------------
   10. Accordion / FAQ panels
   ----------------------------------------------------------------------- */
.accordion-list {
	margin-top: 30px;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.accordion-item {
	border: none;
	margin-bottom: 0;
	padding: 0;
}

.accordion-item-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	cursor: pointer;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 500;
	text-transform: capitalize;
	color: var(--color-heading);
	background: var(--color-light-bg);
	border: 1px solid var(--color-border);
	padding: 14px 20px;
	list-style: none;
}

.accordion-item-heading::-webkit-details-marker {
	display: none;
}

.accordion-item-heading::after {
	content: "\002B";
	font-size: 16px;
	flex-shrink: 0;
}

.accordion-item:not([open]) .accordion-item-heading:hover {
	background: var(--color-primary);
	color: var(--color-white);
}

.accordion-item[open] .accordion-item-heading {
	background: var(--color-primary-deep);
	color: var(--color-white);
}

.accordion-item[open] .accordion-item-heading::after {
	content: "\2212";
}

.accordion-item-body {
	padding: 20px;
	border: 1px solid var(--color-border);
	border-top: none;
}

.accordion-item-body p {
	font-size: 15px;
	line-height: 1.6;
	margin: 0;
}

.faq-cta {
	margin-top: 40px;
	padding-top: 30px;
	border-top: 1px solid var(--color-border);
	text-align: center;
}

@media (max-width: 600px) {
	.accordion-item-heading {
		font-size: 14px;
		padding: 14px 16px;
	}

	.accordion-item-body {
		padding: 16px;
	}

	.faq-cta .btn {
		width: 100%;
		justify-content: center;
	}
}

.page-template-page-accordion .page-content > h2:first-child {
	text-align: center;
}

/* -----------------------------------------------------------------------
   11. Forms (contact / booking / comments)
   ----------------------------------------------------------------------- */
.contact-hero {
	height: 340px;
	background-size: cover;
	background-position: center;
}

.contact-page {
	padding: var(--section-space) 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.contact-page-heading {
	text-align: center;
	font-weight: 400;
	margin: 0 auto 12px;
}

.contact-intro {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}

.contact-intro p {
	line-height: 1.8;
}

.contact-form-section-heading {
	font-size: 19px;
	color: var(--color-primary-deep);
	margin: 30px 0 16px;
}

.contact-form-section-heading:first-of-type {
	margin-top: 10px;
}

.enquiry-form {
	max-width: 760px;
	margin: 20px auto 0;
}

.enquiry-form fieldset {
	border: none;
	padding: 0;
	margin: 0;
}

.form-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 0 20px;
}

.form-field {
	margin-bottom: 18px;
	width: 100%;
}

.form-field--w66 {
	width: calc(66% - 10px);
}

.form-field--w50 {
	width: calc(50% - 10px);
}

.form-field--w33 {
	width: calc(33% - 10px);
}

.form-field label {
	display: block;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 6px;
}

.form-field .required {
	color: var(--color-accent);
}

.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="tel"],
.form-field input[type="date"],
.form-field input[type="time"],
.form-field input[type="number"],
.form-field select,
.form-field textarea,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	padding: 12px 16px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-family: var(--font-body);
	font-size: 15px;
	background: var(--color-white);
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
	outline: 2px solid var(--color-primary);
	outline-offset: 1px;
}

.form-field--error input,
.form-field--error textarea {
	border-color: var(--color-accent);
}

.form-field-error {
	display: block;
	color: var(--color-accent);
	font-size: 13px;
	margin-top: 4px;
}

.form-honeypot {
	position: absolute;
	left: -9999px;
}

.form-notice {
	max-width: 760px;
	margin: 0 auto 30px;
	padding: 16px 20px;
	border-radius: var(--radius-sm);
}

.form-notice--success {
	background: #e5f7ee;
	color: #0a6b3c;
}

.form-notice--error {
	background: #fdeaea;
	color: #a11414;
}

.booking-wizard {
	max-width: 760px;
	margin: 40px 0 0;
}

.booking-progress {
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0 0 40px;
}

.booking-progress-step {
	position: relative;
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.booking-progress-step + .booking-progress-step::before {
	content: "";
	position: absolute;
	top: 17px;
	left: -50%;
	width: 100%;
	height: 2px;
	background: var(--color-border);
	z-index: 0;
}

.booking-progress-step.is-active + .booking-progress-step::before,
.booking-progress-step.is-complete + .booking-progress-step::before {
	background: var(--color-primary);
}

.booking-progress-step-number {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--color-white);
	border: 2px solid var(--color-border);
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 8px;
	color: var(--color-text);
}

.booking-progress-step-label {
	font-size: 13px;
	font-weight: 500;
	color: #888;
}

.booking-progress-step.is-active .booking-progress-step-number,
.booking-progress-step.is-complete .booking-progress-step-number {
	background: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-white);
}

.booking-progress-step.is-active .booking-progress-step-label,
.booking-progress-step.is-complete .booking-progress-step-label {
	color: var(--color-text);
}

.booking-step {
	display: none;
}

.booking-step.is-active {
	display: block;
}

.booking-step-heading {
	font-size: 20px;
	margin-bottom: 20px;
}

.booking-summary {
	background: var(--color-light-bg);
	border-radius: var(--radius-sm);
	padding: 16px 20px;
	margin-bottom: 24px;
}

.booking-summary p {
	margin: 0 0 6px;
	font-size: 14px;
}

.booking-summary p:last-child {
	margin-bottom: 0;
}

.booking-step-nav {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin-top: 10px;
}

.booking-step-nav button {
	margin-left: auto;
}

.booking-step-nav .booking-back {
	margin-left: 0;
	margin-right: auto;
}

@media (max-width: 600px) {
	.booking-progress-step-label {
		display: none;
	}

	.booking-step-nav {
		flex-direction: column-reverse;
	}

	.booking-step-nav button {
		width: 100%;
		justify-content: center;
		margin: 0;
	}
}

.feedback-snippets {
	max-width: 900px;
	margin: 10px 0 50px;
	text-align: center;
}

.feedback-snippets-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-top: 24px;
	text-align: left;
}

.feedback-snippet-card {
	background: var(--color-offwhite);
	border-radius: var(--radius-md);
	padding: 24px;
}

.feedback-snippet-icon {
	color: var(--color-primary);
	font-size: 20px;
	margin-bottom: 10px;
	display: block;
}

.feedback-snippet-quote {
	font-size: 14px;
	line-height: 1.6;
	margin-bottom: 14px;
}

.feedback-snippet-author {
	display: flex;
	flex-direction: column;
	font-size: 13px;
}

.feedback-snippet-author span {
	color: #777;
}

.feedback-snippets-note {
	margin-top: 24px;
	font-weight: 500;
	color: var(--color-heading);
}

.star-rating {
	display: inline-flex;
	flex-direction: row-reverse;
	gap: 6px;
	margin-top: 4px;
}

.star-rating input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
}

.star-rating label {
	cursor: pointer;
	font-size: 32px;
	line-height: 1;
	color: var(--color-border);
	transition: color 0.15s ease;
}

.star-rating label:hover,
.star-rating label:hover ~ label,
.star-rating input:checked ~ label {
	color: #f5a623;
}

.star-rating input:focus-visible + label {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
	border-radius: 4px;
}

@media (max-width: 782px) {
	.feedback-snippets-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.star-rating label {
		font-size: 26px;
	}
}

/* Tango Worldwide: country list + one resource panel (page-tango-worldwide.php).
   Without JS (no .is-enhanced) every panel stacks under the list. */
.worldwide {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: start;
	margin: 20px 0 var(--section-space);
}

.worldwide-nav {
	position: sticky;
	top: 96px;
	display: flex;
	flex-direction: column;
	max-height: calc(100vh - 120px);
	border: 1px solid var(--color-border);
	background: var(--color-white);
}

.worldwide-search {
	position: relative;
	display: block;
	margin: 0;
	border-bottom: 1px solid var(--color-border);
}

.worldwide-search i {
	position: absolute;
	top: 50%;
	left: 16px;
	transform: translateY(-50%);
	font-size: 13px;
	color: var(--color-muted);
}

.worldwide-search input {
	width: 100%;
	padding: 14px 16px 14px 40px;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 14px;
	color: var(--color-heading);
}

.worldwide-search input:focus {
	outline: 2px solid var(--color-primary);
	outline-offset: -2px;
}

.worldwide-nav-list {
	margin: 0;
	padding: 6px 0;
	overflow-y: auto;
	list-style: none;
	overscroll-behavior: contain;
}

.worldwide-nav-list a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 18px;
	border-left: 2px solid transparent;
	color: var(--color-text);
	font-size: 15px;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.worldwide-nav-list a:hover,
.worldwide-nav-list a:focus-visible {
	background: var(--color-light-bg);
	color: var(--color-heading);
}

.worldwide-nav-list a[aria-current="true"] {
	border-left-color: var(--color-primary);
	background: var(--color-light-bg);
	color: var(--color-heading);
	font-weight: 500;
}

.worldwide-nav-flag {
	width: 22px;
	font-size: 18px;
	line-height: 1;
	text-align: center;
}

.worldwide-nav-name {
	flex: 1;
}

.worldwide-nav-count {
	min-width: 28px;
	padding: 1px 8px;
	border-radius: var(--radius-pill);
	background: var(--color-light-bg);
	font-size: 12px;
	color: var(--color-muted);
	text-align: center;
}

.worldwide-nav-list a[aria-current="true"] .worldwide-nav-count {
	background: var(--color-primary);
	color: var(--color-white);
}

.worldwide-nav-empty {
	padding: 12px 18px;
	font-size: 14px;
	color: var(--color-muted);
}

.worldwide-panels {
	display: grid;
	gap: 48px;
}

.worldwide.is-enhanced .worldwide-panel:not(.is-active) {
	display: none;
}

.worldwide-panel:focus {
	outline: none;
}

.worldwide-panel-header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 18px 28px;
	margin-bottom: 24px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--color-gold);
}

.worldwide-panel-eyebrow {
	margin: 0 0 6px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.worldwide-panel-title {
	margin: 0;
	font-size: clamp(32px, 3.4vw, 46px);
	line-height: 1.1;
}

.worldwide-book-travel-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.worldwide-resource-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.worldwide-resource a {
	display: flex;
	flex-direction: column;
	gap: 8px;
	height: 100%;
	padding: 20px 22px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
	color: var(--color-text);
	text-decoration: none;
	transition: border-color 0.25s ease, transform 0.25s ease;
}

.worldwide-resource a:hover,
.worldwide-resource a:focus-visible {
	border-color: var(--color-gold);
	transform: translateY(-2px);
}

.worldwide-resource-title {
	font-family: var(--font-heading);
	font-size: 21px;
	line-height: 1.25;
	color: var(--color-heading);
	overflow-wrap: anywhere;
}

.worldwide-resource-city {
	font-size: 13.5px;
	color: var(--color-muted);
}

.worldwide-resource-city i {
	margin-right: 3px;
	color: var(--color-gold);
}

.worldwide-resource-host {
	margin-top: auto;
	padding-top: 10px;
	border-top: 1px solid var(--color-border);
	font-size: 13px;
	color: var(--color-primary);
	overflow-wrap: anywhere;
}

.worldwide-resource-host i {
	margin-left: 4px;
	font-size: 10px;
}

[data-theme="dark"] .worldwide-nav,
[data-theme="dark"] .worldwide-resource a {
	background: var(--dm-surface);
}

[data-theme="dark"] .worldwide-nav-list a[aria-current="true"],
[data-theme="dark"] .worldwide-nav-list a:hover {
	background: var(--dm-bg);
}

/* Tablet/phone: the country list becomes a horizontal, swipeable strip. */
@media (max-width: 900px) {
	.worldwide {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	.worldwide-nav {
		position: static;
		max-height: none;
	}

	.worldwide-nav-list {
		display: flex;
		gap: 8px;
		padding: 12px;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x proximity;
	}

	.worldwide-nav-list li {
		flex: 0 0 auto;
		scroll-snap-align: start;
	}

	.worldwide-nav-list a {
		padding: 7px 12px;
		border: 1px solid var(--color-border);
		border-left-width: 1px;
		white-space: nowrap;
		font-size: 14px;
	}

	.worldwide-nav-list a[aria-current="true"] {
		border-color: var(--color-primary);
	}
}

@media (max-width: 600px) {
	.worldwide-panel-header {
		align-items: flex-start;
		flex-direction: column;
	}

	.worldwide-book-travel-cta {
		width: 100%;
		justify-content: center;
		text-align: center;
	}

	.worldwide-resource-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -----------------------------------------------------------------------
   12. Footer
   ----------------------------------------------------------------------- */
.site-footer {
	background: var(--color-navy);
	color: rgba(255, 255, 255, 0.72);
}

.site-footer-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: clamp(72px, 8vw, 110px) 24px 64px;
}

.footer-columns {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(5, minmax(0, 1fr));
	gap: 48px 32px;
}

/* The logo sits directly on the ink ground, turned white - no white box. */
.footer-logo-box {
	display: block;
	margin-bottom: 24px;
}

.footer-logo-box img {
	filter: brightness(0) invert(1);
	opacity: 0.95;
}

.footer-tagline {
	font-size: 14px;
	line-height: 1.75;
	max-width: 30ch;
}

.footer-widget-title,
.footer-column h3 {
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
	margin: 0 0 22px;
}

/* Link-column titles take two lines' height and sit on the bottom one, so
   the five lists start level even when a title ("About Argentina Tango")
   wraps. */
.footer-column-links .footer-widget-title {
	display: flex;
	align-items: flex-end;
	min-height: 2.8em;
}


.footer-column-about .footer-widget-title {
	margin-top: 36px;
}

.footer-link-list + .footer-widget-title {
	margin-top: 40px;
}

.footer-icon-list li {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 10px;
	font-size: 14px;
}

.footer-icon-list i {
	font-size: 11px;
	opacity: 0.6;
}

.footer-icon-list a,
.footer-link-list a {
	color: rgba(255, 255, 255, 0.78);
}

.footer-link-list li {
	margin-bottom: 11px;
	font-size: 14px;
	line-height: 1.45;
}

.footer-link-list a {
	transition: color 0.2s ease;
}

.footer-link-list a:hover,
.footer-link-list a:focus,
.footer-icon-list a:hover {
	opacity: 1;
	color: var(--color-white);
}

.footer-social-icons {
	display: flex;
	gap: 8px;
	margin: 28px 0 0;
}

.social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.25);
	color: rgba(255, 255, 255, 0.85);
	font-size: 12px;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.social-icon:hover,
.social-icon:focus {
	opacity: 1;
	border-color: var(--color-white);
	color: var(--color-white);
}

.footer-payment-cards {
	max-width: 170px;
	margin-top: 4px;
	opacity: 0.9;
}

.site-footer-bottom {
	background: var(--color-navy);
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	text-align: center;
	padding: 28px 20px;
	font-size: 12px;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.5);
}

.site-footer-bottom p {
	margin: 0;
}

/* -----------------------------------------------------------------------
   13. Comments
   ----------------------------------------------------------------------- */
.comments-area {
	max-width: 800px;
	margin: 0 auto;
	padding: 40px 20px;
}

.comment-list {
	margin: 30px 0;
}

.comment-body {
	display: flex;
	gap: 16px;
	padding: 20px 0;
	border-bottom: 1px solid var(--color-border);
}

.comment-author img {
	border-radius: 50%;
}

.comment-list .children {
	margin-left: 40px;
	list-style: none;
}

/* -----------------------------------------------------------------------
   14. Misc pages (404, archive layout)
   ----------------------------------------------------------------------- */
.error-404-content {
	text-align: center;
	padding: 100px 20px;
}

.archive-layout {
	display: grid;
	grid-template-columns: minmax(0, 2.5fr) minmax(0, 1fr);
	gap: 50px;
	padding: var(--section-space) 20px;
}

.nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 40px;
}

.nav-links .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 14px;
	border-radius: var(--radius-pill);
	background: var(--color-light-bg);
	color: var(--color-heading);
	font-weight: 500;
	text-decoration: none;
}

.nav-links .page-numbers.current {
	background: var(--color-cta);
	color: var(--color-white);
}

.nav-links .page-numbers.dots {
	background: none;
}

.nav-links a.page-numbers:hover {
	background: var(--color-cta);
	color: var(--color-white);
}

.nav-links .prev.page-numbers,
.nav-links .next.page-numbers {
	padding: 0 20px;
}

/* -----------------------------------------------------------------------
   15. Responsive
   ----------------------------------------------------------------------- */
@media (max-width: 1024px) {
	/* Tablet/phone masthead: logo left, tools and the menu button right. */
	:root {
		--masthead-row: 76px;
	}

	.site-header-inner {
		grid-template-columns: auto minmax(0, 1fr) auto;
		grid-template-areas: "brand tools menu";
		padding-inline: 24px;
		column-gap: 16px;
	}

	.menu-toggle .menu-toggle-label {
		display: none;
	}

	.site-branding {
		padding: 12px 0;
	}

	.site-branding img,
	.custom-logo {
		width: 160px;
	}

	.nav-overlay-inner {
		width: min(640px, 88vw);
		grid-template-columns: minmax(0, 1fr);
		gap: 48px;
		padding: 112px 24px 48px;
	}

	.nav-overlay-image {
		display: none;
	}

	.primary-menu > li > a {
		padding: 13px 0;
		font-size: 26px;
	}

	.primary-menu .sub-menu {
		columns: 1;
	}


	.package-grid,
	.post-grid,
	.package-includes-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.footer-columns {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.archive-layout {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 767px) {
	h1 { font-size: 36px; }
	h2 { font-size: 32px; }
	h3 { font-size: 24px; }

	.page-hero {
		padding: 70px 20px;
	}

	.package-grid,
	.post-grid,
	.package-includes-grid,
	/* The five link lists two-up instead of one long column. */
	.footer-columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 40px 24px;
	}

	.footer-column-about {
		grid-column: 1 / -1;
	}

	:root {
		--masthead-row: 66px;
	}

	.site-header-inner {
		padding-inline: 16px;
		column-gap: 8px;
	}

	.nav-overlay-inner {
		padding: 96px 16px 40px;
	}

	.primary-menu > li > a {
		font-size: 24px;
	}

	.site-branding img,
	.custom-logo {
		width: 124px;
	}

	.header-cta {
		gap: 10px;
	}

	.header-cta .btn {
		padding: 9px 14px;
		font-size: 10.5px;
		letter-spacing: 0.1em;
		flex-shrink: 0;
	}

	.contact-info-boxes {
		flex-direction: column;
	}
}

/* Phones: logo, language, enquire, menu - nothing else fits cleanly. The
   dark-mode toggle drops out here; the site still follows the phone's own
   light/dark setting automatically. */
@media (max-width: 480px) {
	.theme-toggle {
		display: none;
	}

	.site-branding img,
	.custom-logo {
		width: 116px;
	}

	.header-cta {
		gap: 12px;
	}

	.menu-toggle {
		width: 36px;
		padding: 6px 0 6px 8px;
	}
}

/* -----------------------------------------------------------------------
   16. Homepage sections

   Rhythm modelled on the reference sites: generous vertical space, square
   corners, photographs and type on plain ground (no shadowed cards), and
   light / stone / ink bands alternating down the page:
   hero (photo) > intro (white) > press (white) > stats (ink) > process
   (white) > packages (stone) > compare (white) > instagram (white) >
   teachers (stone) > planning (ink) > why us (white) > testimonials
   (stone) > final call to action (photo).
   ----------------------------------------------------------------------- */
.btn-outline-light {
	background: transparent;
	color: var(--color-white);
	border-color: rgba(255, 255, 255, 0.6);
}

.btn-small {
	padding: 10px 20px;
	font-size: 11px;
}

/* Small tracked label above a heading. Used sparingly - only where it
   tells the visitor what kind of section they are in. */
.section-eyebrow {
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	font-family: var(--font-body);
	font-size: 11.5px;
	font-weight: 500;
	color: var(--color-gold);
	margin-bottom: 18px;
}

.section-subtitle {
	text-align: center;
	max-width: 560px;
	margin: -18px auto 36px;
	color: var(--color-muted);
	font-size: 16px;
}

/* Intro: a two-photo collage beside the welcome text - the dance large and
   the city small, overlapping its lower corner inside a mat the colour of
   the page, as in Tully's editorial spreads. */
.home-intro {
	--home-intro-bg: var(--color-white);
	padding: var(--section-space) 0;
	background: var(--home-intro-bg);
}

.home-intro-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(40px, 7vw, 110px);
	align-items: center;
}

.home-intro-media {
	position: relative;
	padding: 0 0 22% 18%;
}

.home-intro-image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: center 30%;
}

/* The milonga: keep the couple in the floral dress, front and centre. */
.home-intro-image--milonga {
	object-position: 52% center;
}

.home-intro-inset {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 54%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border: 12px solid var(--home-intro-bg);
	border-left-width: 0;
	border-bottom-width: 0;
}

/* The stage couple is a wide panorama; centre the crop on the dancers. */
.home-intro-inset--stage {
	object-position: 47% center;
}

.home-intro-content h2 {
	font-size: clamp(36px, 3.8vw, 54px);
	margin-bottom: 28px;
	max-width: 18ch;
}

.home-intro-content > p,
.home-intro-content > .wp-block-group__inner-container > p {
	max-width: 58ch;
	color: var(--color-text);
}

/* The traveler's line becomes a pull quote: large italic serif against a
   single brass rule - no filled box. */
.home-intro-quote {
	margin: 40px 0 44px;
	padding: 0 0 0 28px;
	border-left: 1px solid var(--color-gold);
	background: none;
}

.home-intro-quote p {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: clamp(22px, 2vw, 27px);
	line-height: 1.4;
	color: var(--color-heading);
	margin-bottom: 14px;
}

.home-intro-quote cite {
	font-style: normal;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-muted);
}

/* As Seen In: a quiet credential line, not a headline. */
.as-seen-in {
	padding: 0 0 var(--section-space);
	text-align: center;
	background: var(--color-white);
}

.as-seen-in .container {
	border-top: 1px solid var(--color-border);
	padding-top: var(--section-space);
}

.as-seen-in .section-heading {
	font-family: var(--font-body);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--color-muted);
	margin-bottom: 0;
}

/* The logos in their real brand colours (as on the live site), drifting
   slowly right to left in an endless strip, as on Tully. The list is
   rendered twice back to back (front-page.php) so translating the track by
   exactly half its width loops seamlessly; the edges fade out rather than
   cutting a logo off hard. Hover pauses it; reduced motion gets a still,
   wrapped row instead. */
.partner-marquee {
	position: relative;
	overflow: hidden;
	margin: 32px auto 0;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}

.partner-logos-row {
	display: flex;
	align-items: center;
	width: max-content;
	animation: partner-marquee 38s linear infinite;
}

.partner-marquee:hover .partner-logos-row {
	animation-play-state: paused;
}

@keyframes partner-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* Homepage: the programs drifting slowly between the closing photo and the
   footer (client, 2026-10-22). Serif italic names separated by brass dots;
   hover or keyboard focus pauses it. */
.program-strip {
	overflow: hidden;
	padding-block: 22px;
	background: var(--color-white);
	border-bottom: 1px solid var(--color-border);
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}

.program-strip-track {
	display: flex;
	width: max-content;
	animation: partner-marquee 70s linear infinite;
}

.program-strip:hover .program-strip-track,
.program-strip:focus-within .program-strip-track {
	animation-play-state: paused;
}

.program-strip-list {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.program-strip-list li {
	display: flex;
	align-items: center;
	white-space: nowrap;
}

.program-strip-list li::after {
	content: "";
	width: 5px;
	height: 5px;
	margin: 0 clamp(22px, 2.6vw, 36px);
	border-radius: 50%;
	background: var(--color-gold);
}

.program-strip-list a {
	font-family: var(--font-heading);
	font-size: clamp(19px, 1.7vw, 24px);
	font-style: italic;
	color: var(--color-heading);
	text-decoration: none;
}

.program-strip-list a:hover,
.program-strip-list a:focus-visible {
	color: var(--color-primary);
}

[data-theme="dark"] .program-strip {
	background: var(--dm-bg);
	border-color: var(--color-border);
}

[data-theme="dark"] .program-strip-list a {
	color: var(--dm-heading);
}

@media (prefers-reduced-motion: reduce) {
	.program-strip {
		-webkit-mask-image: none;
		mask-image: none;
	}

	.program-strip-track {
		width: auto;
		justify-content: center;
		animation: none;
	}

	.program-strip-list {
		flex-wrap: wrap;
		justify-content: center;
		row-gap: 10px;
	}

	.program-strip-list[aria-hidden="true"] {
		display: none;
	}
}

.partner-logo-item {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 0 clamp(28px, 3.6vw, 52px);
}

.partner-logo-item img {
	height: 44px;
	width: auto;
	max-width: none;
	mix-blend-mode: multiply;
}

@media (prefers-reduced-motion: reduce) {
	.partner-marquee {
		-webkit-mask-image: none;
		mask-image: none;
	}

	.partner-logos-row {
		width: auto;
		flex-wrap: wrap;
		justify-content: center;
		row-gap: 24px;
		animation: none;
	}

	.partner-logo-item[aria-hidden="true"] {
		display: none;
	}
}

@media (max-width: 767px) {
	.partner-logo-item {
		padding: 0 22px;
	}

	.partner-logo-item img {
		height: 32px;
	}
}

/* Stats: an ink band with the figures set large in the light serif. */
.stats-section {
	padding: var(--section-space) 0;
	background: var(--color-navy);
	color: rgba(255, 255, 255, 0.75);
}

.stats-content .section-heading {
	text-align: center;
	color: var(--color-white);
	margin-bottom: 40px;
}

/* The block editor wraps a Group block's own children in an extra
   ".wp-block-group__inner-container" div, so the grid has to target that
   wrapper rather than ".stats-grid-content" itself. */
.stats-grid-content > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	text-align: center;
}

.stat-item {
	padding: 0 36px;
}

.stat-item + .stat-item {
	border-left: 1px solid rgba(255, 255, 255, 0.14);
}

.stat-icon {
	display: none;
}

/* Count-up figures (theme.js) use fixed-width digits so they don't wobble. */
.stat-value,
.testimonials-trust-item strong,
[data-count-up] {
	font-variant-numeric: tabular-nums;
}

.stat-value {
	display: block;
	font-family: var(--font-heading);
	font-size: clamp(56px, 6vw, 84px);
	font-weight: 400;
	line-height: 1;
	color: var(--color-white);
	margin-bottom: 18px;
}

.stat-item h3 {
	font-family: var(--font-body);
	color: var(--color-gold);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	line-height: 1.6;
	margin: 0 auto 14px;
	max-width: 26ch;
}

.stat-item p:last-child {
	font-size: 15px;
	line-height: 1.7;
	max-width: 32ch;
	margin: 0 auto;
}

/* How it works: the five steps really are a sequence (browse, tailor,
   pay, confirm, arrive), so each is numbered - in the serif, replacing the
   icon-in-a-circle treatment. */
.how-it-works {
	padding: var(--section-space) 0;
	background: var(--color-white);
}

.process-grid-content > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 40px;
	margin-top: 16px;
	text-align: left;
	counter-reset: process-step;
}

.process-item {
	position: relative;
	padding-top: 28px;
	border-top: 1px solid var(--color-border);
	counter-increment: process-step;
}

.process-item::before {
	content: counter(process-step, decimal-leading-zero);
	display: block;
	font-family: var(--font-heading);
	font-size: 40px;
	font-weight: 400;
	line-height: 1;
	color: var(--color-gold);
	margin-bottom: 18px;
}

.process-step-icon {
	display: none;
}

.process-item p {
	font-size: 15px;
	line-height: 1.7;
	margin: 0;
}

.how-it-works .section-cta {
	margin-top: 40px;
	justify-content: center;
}

@media (max-width: 992px) {
	.process-grid-content > .wp-block-group__inner-container {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.process-grid-content > .wp-block-group__inner-container {
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

/* Popular Packages: the same editorial header as the teachers and
   testimonials sections, then portrait photographs with the family name
   set beneath each - the image-then-caption card used across the page, so
   the section reads as part of the site rather than a block of dark tiles. */
.popular-packages {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.popular-packages-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 24px;
	margin-bottom: 40px;
}

.popular-packages-header .section-eyebrow,
.popular-packages-header .section-heading {
	margin: 0;
	text-align: left;
}

.popular-packages-header .section-eyebrow {
	margin-bottom: 18px;
}

.popular-packages .packages-highlights {
	max-width: none;
	margin: 0 0 48px;
}

.category-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 44px 24px;
}

/* Two flexibility reassurances shown above every packages listing - a real
   client requirement ("should stand out more"). Set as a centred pair in
   the display serif between two hairlines: prominent through size and
   placement rather than through a coloured box. */
.packages-highlights {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	margin: 0 auto 56px;
	max-width: 980px;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}

.packages-highlight {
	flex: 1 1 380px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding: 24px 28px;
	text-align: left;
}

.packages-highlight + .packages-highlight {
	border-left: 1px solid var(--color-border);
}

.packages-highlight i {
	flex-shrink: 0;
	font-size: 18px;
	color: var(--color-gold);
}

.packages-highlight span {
	font-family: var(--font-heading);
	font-size: 21px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--color-heading);
}

@media (max-width: 800px) {
	.packages-highlight + .packages-highlight {
		border-left: none;
		border-top: 1px solid var(--color-border);
	}
}

.category-column {
	display: flex;
	flex-direction: column;
	color: var(--color-heading);
}

.category-column-media {
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--color-border);
}

.category-column-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}

a.category-column:hover,
a.category-column:focus {
	opacity: 1;
}

a.category-column:hover .category-column-image,
a.category-column:focus-visible .category-column-image {
	transform: scale(1.05);
}

a.category-column:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 3px;
}

.category-column-body {
	display: block;
	padding-top: 18px;
}

.category-column-title {
	margin: 0 0 8px;
	font-size: 25px;
	font-weight: 500;
	line-height: 1.15;
	color: var(--color-heading);
}

.category-column-meta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.category-column-meta i {
	font-size: 10px;
	transition: transform 0.25s ease;
}

a.category-column:hover .category-column-meta i {
	transform: translateX(4px);
}

/* The eighth cell: a text-only invitation to a tailor-made trip, so the
   seven package families complete a clean four-by-two grid - set as a
   framed panel the height of a photograph, not a dark tile. */
.category-column--note {
	justify-content: center;
	aspect-ratio: 4 / 5;
	padding: 32px 28px;
	border: 1px solid var(--color-gold);
	background: var(--color-white);
}

.category-column--note .category-column-body {
	padding-top: 0;
}

.category-column--note p {
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 1.7;
	color: var(--color-text);
}

.category-column--note .text-link {
	color: var(--color-primary);
}

.category-column--note .text-link:hover {
	color: var(--color-gold);
}

[data-theme="dark"] .category-column-title {
	color: var(--dm-heading);
}

[data-theme="dark"] .category-column--note {
	background: var(--dm-bg);
}

/* Package comparison table */
.package-comparison {
	padding: var(--section-space) 0;
	background: var(--color-white);
}

.package-comparison .section-heading {
	margin-bottom: 44px;
}

.table-wrapper {
	overflow-x: auto;
	max-width: 1240px;
	margin: 0 auto;
}

.packages-table {
	width: 100%;
	border-collapse: collapse;
	min-width: 640px;
	background: var(--color-white);
	border-top: 1px solid var(--color-heading);
}

.packages-table th,
.packages-table td {
	padding: 20px 16px;
	text-align: center;
	border-bottom: 1px solid var(--color-border);
	font-size: 15px;
	color: var(--color-text);
}

.packages-table thead th {
	background: transparent;
	color: var(--color-heading);
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 22px;
	padding-top: 26px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--color-heading);
}

.packages-table td:first-child,
.packages-table th:first-child {
	text-align: left;
	font-family: var(--font-body);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-heading);
}

.packages-table tbody tr:hover {
	background: var(--color-light-bg);
}

.packages-table-unified {
	font-family: var(--font-heading);
	font-size: 19px !important;
	font-style: italic;
	color: var(--color-heading) !important;
}

.packages-table .btn-outline.btn-small {
	background: transparent;
	color: var(--color-heading);
	border-color: var(--color-heading);
}

.packages-table .btn-outline.btn-small:hover,
.packages-table .btn-outline.btn-small:focus {
	background: var(--color-heading);
	color: var(--color-white);
}

/* Instagram */
.instagram-section {
	padding: 0 0 var(--section-space);
	text-align: center;
}

.instagram-section .container {
	border-top: 1px solid var(--color-border);
	padding-top: var(--section-space);
}

.instagram-section .section-heading {
	max-width: 24ch;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 16px;
}

.instagram-section .section-caption {
	max-width: 560px;
	margin: 0 auto;
	color: var(--color-muted);
}

/* Buenos Aires on screen: two Instagram reels either side of the narrated
   city film. Each reel frame shows only Instagram's video box - framed in
   an iframe, the embed is a 54px header, then a 4:5 video box (1.25x the
   iframe's width), then the "View more on Instagram" footer. The iframe is
   shifted up past the header and the frame's 4:5 overflow hides the rest. */
.screen-section .section-eyebrow {
	text-align: center;
}

.screen-row {
	--reel-w: 320px;
	--reel-h: calc(var(--reel-w) * 1.25);
	--screen-gap: 40px;
	display: grid;
	grid-template-columns: var(--reel-w) minmax(0, 1fr) var(--reel-w);
	align-items: start;
	gap: var(--screen-gap);
	margin-top: 56px;
	text-align: left;
	container-type: inline-size;
}

/* Centre the 4:3 film on the reels' height (not on the captions, which
   differ in length): its width is whatever the two reels leave over. */
.screen-row > .screen-feature {
	padding-top: max(0px, calc((var(--reel-h) - (100cqw - 2 * var(--reel-w) - 2 * var(--screen-gap)) * 0.75) / 2));
}

.screen-reel,
.screen-feature {
	margin: 0;
}

.screen-reel-frame {
	position: relative;
	width: var(--reel-w);
	height: var(--reel-h);
	overflow: hidden;
	background: var(--color-navy);
}

.screen-reel-frame > iframe {
	position: absolute;
	top: -54px;
	left: 50%;
	width: var(--reel-embed-w, 100%);
	height: calc(var(--reel-h) + 400px);
	border: 0;
	transform: translateX(-50%);
}

.screen-reel-frame > .consent-embed {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-navy);
}

.screen-reel-frame .consent-embed-notice {
	padding: 20px;
	color: rgba(255, 255, 255, 0.85);
}

.screen-reel-frame .consent-link-button {
	color: var(--color-white);
}

.screen-row figcaption {
	margin-top: 18px;
}

.screen-row figcaption strong {
	display: block;
	font-family: var(--font-heading);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.25;
	color: var(--color-heading);
}

.screen-row figcaption span {
	display: block;
	margin-top: 6px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-muted);
}

.screen-feature figcaption {
	max-width: 46ch;
}

/* The narrated film is played zoomed in a 4:3 frame: the visible window
   runs from about 5% to 81% of the picture's height, so the Expedia logo
   burned into the bottom-right corner (from ~86% down) never shows, and
   neither does YouTube's control bar. Clicking the film pauses it. */
.video-player.video-player--crop {
	aspect-ratio: 4 / 3;
	container-type: size;
}

.video-player.video-player--crop iframe {
	inset: auto;
	top: -6%;
	left: 50%;
	width: calc(130cqh * 16 / 9);
	height: 130%;
	transform: translateX(-50%);
}

/* Reels only (the De Niro section on its own): two reels, centred and
   large (client: "a little bigger and wider, for more impact"). The 9:16
   reel is pillarboxed inside Instagram's 4:5 box - it fills 0.5625 x 1.25 =
   70.3% of the embed's width - so the embed is drawn wider than the frame
   and centred, and the frame crops it to exactly the video: no black bars.
   The height (1.25 x the embed width) is capped to the viewport so a whole
   reel fits on a laptop screen. */
/* Film spreads (client, 2026-10-22: "larger, brighter, more editorial"):
   each reel sits beside its own title like a magazine spread, the second
   mirrored. The reel is drawn larger than before (up to ~490 x 870px) and
   opens on a bright cover photograph. */
.screen-section--stories {
	background: var(--color-light-bg);
}

.screen-stories {
	--reel-embed-w: min(700px, 74svh, calc((100vw - 40px) / 0.703));
	--reel-w: calc(var(--reel-embed-w) * 0.703);
	--reel-h: calc(var(--reel-embed-w) * 1.25);
	display: grid;
	gap: clamp(48px, 6vw, 96px);
	margin-top: clamp(36px, 4vw, 56px);
}

.screen-story {
	display: grid;
	grid-template-columns: var(--reel-w) minmax(0, 460px);
	justify-content: center;
	align-items: center;
	gap: clamp(32px, 6vw, 112px);
	text-align: left;
}

.screen-story--reverse {
	grid-template-columns: minmax(0, 460px) var(--reel-w);
}

.screen-story--reverse .screen-reel {
	order: 2;
}

.screen-story .screen-reel-frame {
	box-shadow: 0 30px 60px -30px rgba(9, 19, 28, 0.45);
}

.screen-story-text .section-eyebrow {
	text-align: left;
	margin-bottom: 14px;
}

.screen-story-text h3 {
	margin: 0;
	padding-top: 22px;
	border-top: 1px solid var(--color-gold);
	font-size: clamp(36px, 4.2vw, 58px);
	font-weight: 400;
	line-height: 1.05;
	text-wrap: balance;
	color: var(--color-heading);
}

.screen-story-lede {
	margin: 18px 0 0;
	font-family: var(--font-heading);
	font-size: clamp(22px, 2vw, 28px);
	font-style: italic;
	line-height: 1.35;
	color: var(--color-heading);
}

.screen-story-credit {
	margin: 16px 0 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-muted);
}

/* The cover: a bright photograph with a play button; the Instagram player
   replaces it on click (assets/js/theme.js). */
.screen-reel-poster {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	width: 100%;
	padding: 24px;
	border: 0;
	cursor: pointer;
	font-family: var(--font-body);
	color: var(--color-white);
	background: var(--color-navy) center / cover no-repeat;
}

.screen-reel-poster[hidden] {
	display: none;
}

.screen-reel-poster::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(9, 19, 28, 0) 45%, rgba(9, 19, 28, 0.45) 100%);
}

.screen-reel-play {
	position: relative;
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	background: rgba(9, 19, 28, 0.35);
	font-size: 22px;
	transition: transform 0.3s ease, background 0.3s ease;
}

.screen-reel-play i {
	margin-left: 4px;
}

.screen-reel-play-label {
	position: relative;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
}

.screen-reel-poster:hover .screen-reel-play,
.screen-reel-poster:focus-visible .screen-reel-play {
	transform: scale(1.06);
	background: var(--color-gold);
}

.screen-reel-poster:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 3px;
}

.screen-reel-frame > .consent-embed-notice--overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
	color: rgba(255, 255, 255, 0.85);
	background: var(--color-navy);
}

[data-theme="dark"] .screen-section--stories {
	background: var(--dm-bg);
}

[data-theme="dark"] .screen-story-text h3,
[data-theme="dark"] .screen-story-lede {
	color: var(--dm-heading);
}

@media (prefers-reduced-motion: reduce) {
	.screen-reel-play {
		transition: none;
	}
}

@media (max-width: 860px) {
	.screen-stories {
		--reel-embed-w: min(640px, 78svh, calc((100vw - 40px) / 0.703));
	}

	.screen-story,
	.screen-story--reverse {
		grid-template-columns: minmax(0, var(--reel-w));
		justify-items: center;
		text-align: center;
		gap: 28px;
	}

	.screen-story--reverse .screen-reel {
		order: 0;
	}

	.screen-story-text .section-eyebrow {
		text-align: center;
	}
}

@media (max-width: 1100px) {
	.screen-row {
		grid-template-columns: repeat(2, var(--reel-w));
		justify-content: center;
		align-items: start;
	}

	.screen-row > .screen-feature {
		grid-column: 1 / -1;
		grid-row: 1;
		width: 100%;
		max-width: 720px;
		justify-self: center;
		padding-top: 0;
	}
}

@media (max-width: 680px) {
	.screen-row {
		grid-template-columns: var(--reel-w);
	}
}

[data-theme="dark"] .screen-row figcaption strong {
	color: var(--dm-heading);
}

/* Planning Your Trip: an ink band with a horizontal strip of portrait
   photographs, captions set beneath each image. */
.planning-trip {
	padding: var(--section-space) 0;
	background: var(--color-navy);
	color: var(--color-white);
}

.planning-trip-panel {
	background: none;
	border: none;
	padding: 0;
}

.planning-trip-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 24px;
	margin-bottom: 48px;
}

.planning-trip-header .section-heading {
	margin: 0;
	text-align: left;
	color: var(--color-white);
	max-width: 22ch;
}

.planning-trip-hint {
	display: none;
	align-items: center;
	gap: 8px;
	margin: -24px 0 20px;
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.6);
}

.planning-trip-scroller {
	display: flex;
	gap: 20px;
	overflow-x: auto;
	padding-bottom: 20px;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}

.planning-trip-item {
	flex: 0 0 236px;
	scroll-snap-align: start;
	position: relative;
	display: block;
	color: var(--color-white);
}

.planning-trip-item img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	transition: opacity 0.3s ease;
}

.planning-trip-item:hover {
	opacity: 1;
}

.planning-trip-item:hover img {
	opacity: 0.82;
}

.planning-trip-item span {
	display: block;
	padding-top: 16px;
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 21px;
	line-height: 1.25;
}

.planning-trip-item span i {
	display: none;
}

/* Why Us preview: photograph beside three short reasons, divided by
   hairlines rather than boxed in cards. */
.why-us-preview {
	padding: var(--section-space) 0;
	background: var(--color-white);
}

.why-us-preview-grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: clamp(40px, 7vw, 110px);
	align-items: center;
}

.why-us-preview-media {
	overflow: hidden;
}

.why-us-preview-media img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	display: block;
}

.why-us-preview-content .section-eyebrow,
.why-us-preview-content .section-heading {
	text-align: left;
}

.why-us-preview-content .section-heading {
	margin-bottom: 36px;
}

.why-us-preview-cards {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	margin: 0 0 44px;
	border-top: 1px solid var(--color-border);
}

.why-us-preview-card {
	display: grid;
	grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
	gap: 24px;
	padding: 24px 0;
	border-bottom: 1px solid var(--color-border);
}

.why-us-preview-card i {
	display: none;
}

.why-us-preview-card h3 {
	font-size: 24px;
	margin: 0;
}

.why-us-preview-card p {
	font-size: 15px;
	color: var(--color-text);
	margin: 0;
}

@media (max-width: 900px) {
	.why-us-preview-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.why-us-preview-card {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}
}

/* Testimonials: one guest's words at a time, set large in the italic
   serif beside their photograph - no card, no shadow. */
.testimonials-section {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.testimonials-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 56px;
}

.testimonials-header .section-heading {
	margin: 0;
	text-align: left;
}

.testimonials-slider {
	overflow: hidden;
}

.testimonials-grid {
	display: flex;
	transition: transform 0.6s ease;
}

.testimonial-card {
	flex: 0 0 100%;
	width: 100%;
	background: var(--color-white);
	padding: 44px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 340px);
	gap: 48px;
	align-items: center;
}

.testimonials-slider .testimonial-card {
	background: transparent;
	padding: 0;
	grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
	gap: clamp(40px, 7vw, 110px);
}

.testimonial-card-body {
	max-width: 640px;
}

.testimonial-dots {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 6px;
	margin-top: 44px;
}

.testimonial-dots button {
	width: 28px;
	height: 2px;
	padding: 0;
	border: none;
	background: var(--color-border);
	cursor: pointer;
	transition: background-color 0.3s ease, width 0.3s ease;
}

.testimonial-dots button.active {
	width: 48px;
	background: var(--color-heading);
}

.testimonial-card-photo {
	width: 100%;
	aspect-ratio: 4 / 5;
	overflow: hidden;
}

.testimonial-card-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.testimonial-card-icon {
	display: none;
}

.testimonial-card-quote {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: clamp(22px, 2.1vw, 28px);
	line-height: 1.45;
	color: var(--color-heading);
	margin-bottom: 32px;
}

/* Only the homepage slider adds typographic quote marks - some other pages
   already include them in their testimonial snippet text. */
.testimonials-slider .testimonial-card-quote::before {
	content: "\201C";
}

.testimonials-slider .testimonial-card-quote::after {
	content: "\201D";
}

.testimonial-card-author {
	margin: 0;
}

.testimonial-card-author strong {
	display: block;
	font-family: var(--font-body);
	font-style: normal;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-heading);
	margin-bottom: 4px;
}

.testimonial-card-author span {
	font-size: 14px;
	color: var(--color-muted);
}

@media (max-width: 767px) {
	.testimonial-card {
		grid-template-columns: 1fr;
		padding: 32px 26px;
		text-align: left;
	}

	.testimonials-slider .testimonial-card {
		grid-template-columns: 1fr;
		padding: 0;
	}

	.testimonials-slider .testimonial-card-photo {
		order: -1;
		aspect-ratio: 4 / 3;
	}
}

/* Final call to action: a light closing spread (it used to be a dark
   photograph that ran straight into the navy footer) - the invitation on
   the left, a milonga couple with a Buenos Aires view overlapping its
   corner on the right. */
.final-cta {
	padding: var(--section-space) 0;
	background: var(--color-white);
	border-top: 1px solid var(--color-border);
}

.final-cta-grid {
	display: grid;
	grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
	gap: clamp(40px, 6vw, 96px);
	align-items: center;
}

.final-cta-content .section-eyebrow {
	text-align: left;
	margin-bottom: 18px;
}

.final-cta h2 {
	margin: 0 0 24px;
	font-size: clamp(38px, 4.4vw, 62px);
	font-weight: 400;
	line-height: 1.08;
	text-align: left;
	color: var(--color-heading);
}

.final-cta h2 span {
	display: block;
	margin-top: 10px;
	font-size: 0.6em;
	font-style: italic;
	color: var(--color-primary);
}

.final-cta p:not(.section-eyebrow) {
	max-width: 520px;
	margin: 0 0 36px;
	font-size: 17px;
	line-height: 1.75;
	color: var(--color-text);
}

.final-cta-media {
	position: relative;
	padding: 0 0 18% 16%;
}

.final-cta-image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: center 30%;
}

.final-cta-inset {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 56%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border: 12px solid var(--color-white);
	border-left-width: 0;
	border-bottom-width: 0;
}

@media (max-width: 900px) {
	.final-cta-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.final-cta-media {
		max-width: 520px;
	}
}

/* Photo variant (About, Hotels): full-bleed photograph under an ink scrim,
   the closing statement large and centred. */
.final-cta--photo {
	position: relative;
	padding: clamp(72px, 7.5vw, 108px) 0;
	border-top: 0;
	text-align: center;
	color: var(--color-white);
	background: var(--color-navy) var(--final-cta-image, none) center 30%/cover no-repeat;
}

.final-cta--photo::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(9, 19, 28, 0.62);
}

.final-cta--photo .final-cta-inner {
	position: relative;
	z-index: 1;
	max-width: 760px;
}

.final-cta--photo h2 {
	margin-bottom: 24px;
	font-size: clamp(40px, 5vw, 68px);
	text-align: center;
	color: var(--color-white);
}

.final-cta.final-cta--photo p:not(.section-eyebrow) {
	max-width: 560px;
	margin: 0 auto 44px;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.85);
}

/* Homepage closing band: the gazebo milonga is a night photograph, so it
   gets a lighter scrim, a crop on the lit canopy, and white space before
   the navy footer so the two never read as one dark block. */
.final-cta--home {
	margin-bottom: 0;
	background-position: center 38%;
	padding: clamp(96px, 10vw, 150px) 0;
}

.final-cta--home::before {
	background: linear-gradient(180deg, rgba(9, 19, 28, 0.38) 0%, rgba(9, 19, 28, 0.5) 100%);
}

.final-cta--home .section-eyebrow {
	color: rgba(255, 255, 255, 0.85);
}

.final-cta--home h2 span {
	display: block;
	color: var(--color-white);
}

/* Homepage short-stay banner (Tango Experience): the photo band at feature
   spacing, cropped on the dancers rather than the bandoneón player. */
.final-cta--short-stay {
	padding: var(--section-space-lg) 0;
	background-position: 70% 40%;
}

.final-cta--short-stay .section-eyebrow,
.final-cta--short-stay h2 span {
	color: rgba(255, 255, 255, 0.88);
}

[data-theme="dark"] .final-cta.final-cta--photo {
	background-color: var(--color-navy);
}

[data-theme="dark"] .final-cta--photo h2 {
	color: var(--color-white);
}

[data-theme="dark"] .final-cta {
	background: var(--dm-bg);
}

[data-theme="dark"] .final-cta h2 {
	color: var(--dm-heading);
}

[data-theme="dark"] .final-cta-inset {
	border-color: var(--dm-bg);
}

@media (max-width: 1024px) {
	.home-intro-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.home-intro-media {
		width: 100%;
		max-width: 560px;
	}

	.category-grid,
	.process-grid-content > .wp-block-group__inner-container {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.stat-item {
		padding: 0 20px;
	}
}

@media (max-width: 767px) {
	.stats-grid-content > .wp-block-group__inner-container,
	.process-grid-content > .wp-block-group__inner-container {
		grid-template-columns: minmax(0, 1fr);
	}

	.stat-item {
		padding: 36px 0;
	}

	.stat-item + .stat-item {
		border-left: none;
		border-top: 1px solid rgba(255, 255, 255, 0.14);
	}

	.category-grid {
		gap: 32px 14px;
	}

	.category-column-body {
		padding-top: 14px;
	}

	.category-column-title {
		font-size: 21px;
	}

	.category-column-meta {
		font-size: 10px;
		letter-spacing: 0.14em;
	}

	.category-column--note {
		grid-column: 1 / -1;
		aspect-ratio: auto;
		padding: 24px 22px;
	}

	.testimonial-card {
		grid-template-columns: minmax(0, 1fr);
	}

	.planning-trip-header,
	.testimonials-header {
		flex-direction: column;
		align-items: flex-start;
	}

	.teacher-intro-row {
		flex-direction: column;
	}

	.planning-trip-hint {
		display: flex;
	}

	/* Package comparison table: a 640px-wide table forces horizontal
	   scrolling on every phone, and that scroll affordance is easy to miss,
	   so each row becomes a stacked "feature" block instead - the row label
	   is the block heading, and each package's value keeps its column header
	   as a data-label prefix (added in front-page.php) rather than being
	   duplicated as separate markup. */
	.table-wrapper {
		overflow-x: visible;
	}

	.packages-table {
		min-width: 0;
		border-top: none;
	}

	.packages-table thead {
		display: none;
	}

	.packages-table,
	.packages-table tbody,
	.packages-table tr,
	.packages-table td {
		display: block;
		width: 100%;
	}

	.packages-table tr {
		margin-bottom: 20px;
		border: 1px solid var(--color-border);
	}

	.packages-table tbody tr:hover {
		background: none;
	}

	.packages-table td {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		text-align: right;
		padding: 12px 16px;
		border-bottom: 1px solid var(--color-border);
	}

	.packages-table tr td:last-child {
		border-bottom: none;
	}

	.packages-table td:first-child {
		justify-content: center;
		background: var(--color-navy);
		color: var(--color-white);
		text-align: center;
	}

	.packages-table td[data-label]::before {
		content: attr(data-label);
		font-weight: 500;
		color: var(--color-heading);
		text-align: left;
	}
}

@media (max-width: 480px) {
	.planning-trip-item {
		flex-basis: 190px;
	}
}

/* -----------------------------------------------------------------------
   17. Teachers
   ----------------------------------------------------------------------- */
.teacher-single {
	padding: var(--section-space) 20px;
}

.teacher-intro-row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 40px;
}

.teacher-intro-text {
	flex: 1 1 60%;
	min-width: 0;
}

.teacher-intro-media {
	flex: 1 1 35%;
	min-width: 0;
}

.teacher-intro-media img {
	border-radius: var(--radius-md);
	width: 100%;
}

.teacher-more {
	margin-top: 20px;
}

.teacher-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 20px;
}

.teacher-cta-note {
	flex-basis: 100%;
	font-size: 13.5px;
	color: var(--color-text);
	opacity: 0.8;
	max-width: 560px;
}

.teacher-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 48px 24px;
	padding: 56px 0;
}

/* Teacher cards: portrait photograph, name in the serif, a short line
   beneath - no box, border or lift, matching the image-first cards used
   throughout the reference sites. */
.teacher-card {
	background: none;
}

.teacher-card-link {
	display: block;
	color: inherit;
}

.teacher-card-link:hover,
.teacher-card-link:focus {
	opacity: 1;
}

.teacher-card-media {
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--color-border);
}

.teacher-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.teacher-card-link:hover .teacher-card-media img,
.teacher-card-link:focus-visible .teacher-card-media img {
	transform: scale(1.04);
}

.teacher-card-link:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 4px;
}

.teacher-card-body {
	padding: 22px 0 0;
}

.teacher-card-title {
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	margin-bottom: 10px;
}

.teacher-card-excerpt {
	font-size: 14px;
	line-height: 1.65;
	color: var(--color-muted);
	margin: 0;
}

/* Homepage teachers band: on stone, between the white Instagram and the
   ink Planning bands. */
.teachers-preview {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.teachers-preview-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 24px;
}

.teachers-preview-header .section-heading,
.teachers-preview-header .section-eyebrow {
	text-align: left;
	margin: 0;
}

.teachers-preview-header .section-eyebrow {
	margin-bottom: 18px;
}

/* Teacher availability: a clearly framed notice (client asked for it to be
   "much clearer and more visible") - brass rule, icon, short bold lead. */
.teacher-availability {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	max-width: 820px;
	margin: 0 auto;
	padding: 22px 28px;
	background: var(--color-gold-soft);
	border-left: 3px solid var(--color-gold);
	text-align: left;
}

.teacher-availability-icon {
	flex-shrink: 0;
	margin-top: 4px;
	font-size: 22px;
	color: var(--color-gold);
}

.teacher-availability p {
	margin: 0;
	color: var(--color-text);
	font-size: 15.5px;
	line-height: 1.65;
}

.teacher-availability .teacher-availability-title {
	margin-bottom: 4px;
	font-family: var(--font-heading);
	font-size: 22px;
	line-height: 1.3;
	color: var(--color-heading);
}

.teacher-archive {
	padding-top: var(--section-space);
	padding-bottom: var(--section-space);
}

.teachers-preview .teacher-availability {
	margin-top: 48px;
}

.teacher-archive .teacher-availability {
	margin: 0 auto var(--section-space);
}

[data-theme="dark"] .teacher-availability {
	background: rgba(168, 138, 85, 0.14);
}

[data-theme="dark"] .teacher-availability p {
	color: var(--dm-text, #d6d9db);
}

[data-theme="dark"] .teacher-availability .teacher-availability-title {
	color: var(--dm-heading, #fff);
}

.testimonial-single {
	padding: var(--section-space) 20px;
	max-width: 900px;
}

.testimonial-single .testimonial-card {
	border: 1px solid var(--color-border);
}

@media (max-width: 1024px) {
	.teacher-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 480px) {
	.teacher-grid {
		gap: 36px 14px;
	}

	.teacher-card-title {
		font-size: 20px;
	}
}

/* -----------------------------------------------------------------------
   18. Package/Service hub pages
   ----------------------------------------------------------------------- */
.package-hub {
	padding: var(--section-space) 20px;
}

.package-hub-intro,
.package-hub-notes {
	max-width: 1100px;
	margin: 0 auto 50px;
}

.package-hub-notes {
	margin-bottom: 0;
}

.package-hub-intro-row > .wp-block-group__inner-container,
.package-hub-notes-row > .wp-block-group__inner-container {
	display: flex;
	align-items: flex-start;
	gap: 40px;
}

.package-hub-intro-text,
.package-hub-notes-text {
	flex: 1 1 55%;
	min-width: 0;
}

.package-hub-intro-media,
.package-hub-notes-media {
	flex: 1 1 40%;
	min-width: 0;
}

.package-hub-intro-media img,
.package-hub-notes-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--radius-md);
	display: block;
}

.package-hub-intro-text {
	padding: 8px 0;
}

/* The opening maestro quote on each hub page: italic serif against a single
   brass rule, the same pull-quote treatment as the homepage intro. */
.package-hub-intro-text > p:first-child,
.package-hub-intro-text > .wp-block-group__inner-container > p:first-child {
	border-left: 1px solid var(--color-gold);
	padding: 4px 0 4px 26px;
	margin-bottom: 32px;
	font-family: var(--font-heading);
	font-style: italic;
	font-size: 23px;
	line-height: 1.45;
	color: var(--color-heading);
}

.package-hub-cta {
	margin-top: 20px;
}

.package-hub-notes-text h2 {
	margin-bottom: 24px;
}

.package-hub-notes-text ul {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 24px;
}

.package-hub-notes-text ul li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 15px;
	line-height: 1.6;
}

.package-hub-notes-text ul li::before {
	content: "\f058";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: var(--color-primary);
	flex-shrink: 0;
	margin-top: 3px;
}

@media (max-width: 782px) {
	/* The block editor's inner wrapper is the actual flex container (see
	   the rule above), so that is what has to stack on small screens. */
	.package-hub-intro-row,
	.package-hub-notes-row,
	.package-hub-intro-row > .wp-block-group__inner-container,
	.package-hub-notes-row > .wp-block-group__inner-container {
		flex-direction: column;
	}

	.package-hub-intro-media,
	.package-hub-notes-media {
		width: 100%;
	}

	.contact-page {
		grid-template-columns: minmax(0, 1fr);
	}

	.single-post-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.form-field--w66,
	.form-field--w50,
	.form-field--w33 {
		width: 100%;
	}
}

/* Package tiers: a row of square stone cells with the tier name in the
   serif; the longest tier is set in ink as the natural "most complete"
   choice. */
.package-hub-tiers {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 12px;
	margin-bottom: var(--section-space);
}

.package-hub-tier {
	background: var(--color-light-bg);
	color: var(--color-heading);
	padding: 36px 26px 30px;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 18px;
}

.package-hub-tier h3 {
	color: var(--color-heading);
	font-size: 25px;
	font-weight: 500;
	line-height: 1.15;
	margin: 0;
}

.package-hub-tier p {
	font-size: 13px;
	letter-spacing: 0.04em;
	margin: 0;
	color: var(--color-muted);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}

.package-hub-tier p i {
	display: none;
}

.package-hub-tier--highlight {
	background: var(--color-navy);
}

.package-hub-tier--highlight h3 {
	color: var(--color-white);
}

.package-hub-tier--highlight p {
	color: rgba(255, 255, 255, 0.7);
}

.btn-tier {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	gap: 8px;
	background: transparent;
	color: var(--color-heading);
	border: 1px solid var(--color-heading);
	padding: 12px 24px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.btn-tier i {
	display: none;
}

.btn-tier:hover,
.btn-tier:focus {
	opacity: 1;
	background: var(--color-heading);
	color: var(--color-white);
}

.package-hub-tier--highlight .btn-tier {
	color: var(--color-white);
	border-color: rgba(255, 255, 255, 0.7);
}

.package-hub-tier--highlight .btn-tier:hover,
.package-hub-tier--highlight .btn-tier:focus {
	background: var(--color-white);
	color: var(--color-heading);
}

[data-theme="dark"] .package-hub-tier {
	background: var(--dm-surface);
}

[data-theme="dark"] .package-hub-tier h3 {
	color: var(--dm-heading);
}

[data-theme="dark"] .btn-tier {
	color: var(--dm-heading);
	border-color: rgba(255, 255, 255, 0.55);
}

/* Planning Your Trip hub page: 16 photo-tile link cards, the same set and
   order the live site lists under "Planning Your Trip". */
.planning-hub {
	padding-block: var(--section-space);
}

.planning-hub-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.planning-hub-card {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 4;
}

.planning-hub-card:hover,
.planning-hub-card:focus {
	opacity: 1;
}

.planning-hub-card-media img {
	transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.planning-hub-card:hover .planning-hub-card-media img {
	transform: scale(1.05);
}

.planning-hub-card-media {
	position: absolute;
	inset: 0;
}

.planning-hub-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.planning-hub-card-media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.1) 55%, transparent 100%);
}

.planning-hub-card-title {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 22px 22px;
	color: var(--color-white);
	font-family: var(--font-heading);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.15;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.planning-hub-card-title i {
	display: none;
}

.planning-hub-notes {
	max-width: 800px;
	margin: 50px auto 0;
}

/* Sitemap page: a grouped link directory, matching the footer's own
   Argentina Tango / Popular Packages / Great Teachers / Planning Your Trip /
   Other Services / Useful Information / Help grouping. */
.sitemap-page {
	padding-block: var(--section-space);
}

.sitemap-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 40px;
}

.sitemap-group h2 {
	font-size: 18px;
	margin-bottom: 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--color-border);
}

.sitemap-group ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.sitemap-group a {
	color: var(--color-text);
	font-size: 15px;
}

.sitemap-group a:hover {
	color: var(--color-primary);
}

@media (max-width: 992px) {
	.sitemap-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.sitemap-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 992px) {
	.planning-hub-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.planning-hub-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 480px) {
	.planning-hub-grid {
		grid-template-columns: 1fr;
	}
}

/* -----------------------------------------------------------------------
   19. Tango Experience detail pages (Tango Class, Milonga Discovery, etc.)
   ----------------------------------------------------------------------- */
.experience-detail-cta {
	max-width: 1100px;
	margin: 40px auto 0;
	background: var(--color-light-bg);
	border-radius: var(--radius-md);
	padding: 32px;
	text-align: center;
}

.experience-detail-cta h2 {
	margin: 0;
}

.experience-detail-cta p {
	margin: 0;
}

/* -----------------------------------------------------------------------
   20. About Us page
   ----------------------------------------------------------------------- */
.about-intro-row {
	max-width: 1200px;
	margin: 0 auto;
	padding: 50px 20px;
}

.about-intro-row > .wp-block-group__inner-container {
	display: flex;
	align-items: flex-start;
	gap: 48px;
}

.about-intro-text,
.about-intro-media {
	flex: 1 1 50%;
	min-width: 0;
}

/* The Borges quote: italic serif against a single brass rule, matching
   the pull quotes on the homepage and hub pages. */
.about-intro-quote {
	margin-top: 32px;
	border: none;
	border-left: 1px solid var(--color-gold);
	padding: 4px 0 4px 26px;
	box-shadow: none;
}

.about-intro-quote > .wp-block-group__inner-container > p:first-child {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: 23px;
	line-height: 1.45;
	color: var(--color-heading);
	margin-bottom: 12px;
}

/* The attribution is authored as a heading block; set it as a credit. */
.about-intro-quote h2,
.about-intro-quote h3,
.about-intro-quote h4 {
	font-family: var(--font-body);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-muted);
	margin: 0;
}

.about-intro-media img {
	width: 100%;
	border-radius: var(--radius-md);
	display: block;
}

.about-cards {
	max-width: 1200px;
	margin: 0 auto var(--section-space);
	background: var(--color-light-bg);
	border-radius: 0;
	padding: 50px 30px;
}

.about-cards > .wp-block-group__inner-container {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

.about-card {
	flex: 1 1 calc(25% - 24px);
	min-width: 220px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 0;
	padding: 28px;
}

.about-card h3 {
	margin-bottom: 12px;
}

.about-card p {
	margin: 0;
}

@media (max-width: 1024px) {
	.about-card {
		flex: 1 1 calc(50% - 24px);
	}
}

@media (max-width: 782px) {
	.about-intro-row > .wp-block-group__inner-container {
		flex-direction: column;
	}

	.about-card {
		flex: 1 1 100%;
	}
}

.about-hero-cta {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
	padding: 36px 20px 0;
}

.about-mission {
	padding: 40px 0 10px;
	text-align: center;
}

.about-mission-text {
	max-width: 720px;
	margin: 0 auto;
	font-family: var(--font-heading);
	font-size: 22px;
	line-height: 1.5;
	color: var(--color-heading);
}

.about-teachers,
.about-testimonials {
	padding: var(--section-space) 0;
}

.about-testimonials {
	background: var(--color-light-bg);
}

.about-section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 30px;
}

.about-section-header .section-eyebrow,
.about-section-header .section-heading {
	text-align: left;
	margin: 0;
}

@media (max-width: 600px) {
	.about-hero-cta {
		flex-direction: column;
	}

	.about-hero-cta .btn {
		width: 100%;
		justify-content: center;
	}

	.about-mission-text {
		font-size: 19px;
	}
}

/* -----------------------------------------------------------------------
   21. Our Services page
   ----------------------------------------------------------------------- */
.services-intro-row {
	max-width: 1200px;
	margin: 0 auto;
	padding: 50px 20px;
}

.services-intro-row > .wp-block-group__inner-container {
	display: flex;
	align-items: flex-start;
	gap: 48px;
}

.services-intro-text,
.services-intro-media {
	flex: 1 1 50%;
	min-width: 0;
}

.services-intro-quote {
	margin-bottom: 24px;
	background: var(--color-light-bg);
	border: 1px solid var(--color-border);
	border-radius: 0;
	padding: 32px;
	text-align: center;
}

.services-intro-quote > .wp-block-group__inner-container > p:first-child {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: 18px;
	margin-bottom: 12px;
}

.services-intro-media img {
	width: 100%;
	border-radius: var(--radius-md);
	display: block;
}

@media (max-width: 782px) {
	.services-intro-row > .wp-block-group__inner-container {
		flex-direction: column;
	}
}

.services-cards-section {
	padding-block: 20px var(--section-space);
	text-align: center;
}

.services-cards-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-top: 40px;
	text-align: left;
}

.services-cards-grid--pair {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 900px;
	margin-inline: auto;
}

.service-card {
	display: flex;
	flex-direction: column;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 30px;
}

.service-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 20px;
	margin-bottom: 18px;
}

.service-card h3 {
	font-size: 18px;
	margin-bottom: 14px;
}

.service-card-text {
	margin: -4px 0 16px;
	font-family: var(--font-heading);
	font-size: 19px;
	font-style: italic;
	line-height: 1.4;
	color: var(--color-heading);
}

/* Benefit checklists in page content (the client's ✅ lists): a list block
   with the class "benefit-list", two columns with brass check marks. */
.benefit-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 32px;
	margin: 28px 0;
	padding: 24px 0;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
	list-style: none;
}

.benefit-list li {
	position: relative;
	margin: 0;
	padding-left: 30px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--color-heading);
}

.benefit-list li::before {
	content: "\f00c";
	position: absolute;
	left: 0;
	top: 0.1em;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 14px;
	color: var(--color-gold);
}

.benefit-list--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.benefit-list--4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* A checklist on its own band ("Who We Work With", "Ideal For"). */
.checklist-band {
	padding-block: var(--section-space);
	text-align: center;
}

.checklist-band .benefit-list {
	max-width: 1040px;
	margin: 28px auto 0;
	text-align: left;
}

/* Booking Our Services (page-booking.php): two-column intake, program
   image cards, the booking information card. */
.booking-services-page {
	padding-block: var(--section-space) 0;
}

.booking-services-page {
	padding-bottom: var(--section-space);
}

.booking-services-page .booking-wizard,
.booking-services-page .booking-form {
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
}

.booking-services-page .booking-progress {
	margin-bottom: 28px;
}

.booking-intake {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 40px;
	align-items: start;
}

.booking-intake-column textarea {
	min-height: 140px;
}

.program-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-bottom: 28px;
}

.program-card {
	position: relative;
	display: flex;
	flex-direction: column;
	cursor: pointer;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.program-card input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.program-card-photo img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.program-card-body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 16px 18px 18px;
}

.program-card-body strong {
	font-family: var(--font-heading);
	font-size: 21px;
	font-weight: 400;
	color: var(--color-heading);
}

.program-card-body span {
	font-size: 14px;
	line-height: 1.55;
	color: var(--color-text);
}

.program-card:hover {
	border-color: var(--color-gold);
}

.program-card:has(input:checked) {
	border-color: var(--color-gold);
	box-shadow: inset 0 0 0 2px var(--color-gold);
}

.program-card:has(input:focus-visible) {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

.program-card--unsure {
	justify-content: center;
	background: var(--color-light-bg);
	text-align: center;
}

.program-card--unsure i {
	align-self: center;
	font-size: 26px;
	color: var(--color-gold);
}

.booking-info-section {
	padding-block: var(--section-space);
}

.booking-info-card {
	max-width: 860px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 44px);
	text-align: left;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 1px solid var(--color-gold);
}

.booking-info-card h2 {
	margin: 0 0 12px;
	font-size: 28px;
	text-align: left;
}

.booking-info-card h2:not(:first-child) {
	margin-top: 28px;
}

/* Breathing room before the dark footer (client, 2026-10-22). */
.booking-next-steps {
	margin-bottom: clamp(32px, 4vw, 56px);
}

@media (max-width: 900px) {
	.booking-intake {
		grid-template-columns: minmax(0, 1fr);
	}

	.program-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.program-cards {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Contact Us: reassurance, what happens next, direct contact. */
.contact-reassure {
	margin: 12px 0 8px;
	padding: 26px 28px 6px;
	background: var(--color-light-bg);
	border-top: 1px solid var(--color-gold);
}

.contact-reassure h2,
.contact-direct h2 {
	margin: 0 0 10px;
	font-size: 28px;
	text-align: left;
}

.contact-reassure p {
	margin: 0;
	max-width: 70ch;
}

.contact-reassure .benefit-list {
	margin-bottom: 18px;
	border-bottom: 0;
}

.contact-next ol {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
	counter-reset: contact-next;
}

.contact-next li {
	counter-increment: contact-next;
	font-size: 15px;
	line-height: 1.5;
}

.contact-next li::before {
	content: counter(contact-next);
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin-bottom: 8px;
	border: 1px solid var(--color-gold);
	border-radius: 50%;
	font-family: var(--font-heading);
	font-size: 18px;
	color: var(--color-gold);
}

.contact-direct {
	margin-top: 36px;
	padding-top: 24px;
	border-top: 1px solid var(--color-border);
}

.contact-direct p {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 32px;
	margin: 0;
	font-size: 17px;
}

.contact-direct a {
	color: var(--color-heading);
	text-decoration: none;
}

.contact-direct i {
	margin-right: 6px;
	color: var(--color-gold);
}

@media (max-width: 700px) {
	.contact-next ol {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Press: "Featured Coverage" (shown once an article is marked featured). */
.press-featured-section {
	padding-block: var(--section-space) 0;
}

.press-featured {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: clamp(24px, 4vw, 56px);
	align-items: center;
	margin-top: 18px;
}

.press-featured-media img {
	display: block;
	width: 100%;
	height: auto;
}

.press-featured-body h2 {
	margin: 8px 0 14px;
	font-size: clamp(28px, 3vw, 40px);
	text-align: left;
}

.press-logo-item a {
	display: block;
	transition: opacity 0.2s ease;
}

.press-logo-item a:hover,
.press-logo-item a:focus-visible {
	opacity: 0.75;
}

@media (max-width: 800px) {
	.press-featured {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Tango Worldwide: listing category and description. */
.worldwide-resource-category {
	display: block;
	margin-bottom: 4px;
	font-size: 10.5px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.worldwide-resource-excerpt {
	display: block;
	margin-top: 4px;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--color-muted);
}

.job-card-open {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 8px;
	vertical-align: middle;
	font-family: var(--font-body);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-white);
	background: var(--color-gold);
}

/* Our Services: service cards grouped under small headings. */
.services-group-heading {
	margin: 40px 0 18px;
	padding-top: 18px;
	border-top: 1px solid var(--color-gold);
	font-size: 28px;
	text-align: left;
}

.services-group-heading:first-of-type {
	margin-top: 8px;
}

.services-group-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Terms & Conditions (page-terms.php): date, quick links, panels. */
.terms-page {
	padding-bottom: var(--section-space);
}

.terms-updated {
	margin: 0 0 20px;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-muted);
}

.terms-nav {
	margin: 0 0 32px;
	padding: 22px 26px;
	background: var(--color-light-bg);
	border-top: 1px solid var(--color-gold);
}

.terms-nav .section-eyebrow {
	margin-bottom: 12px;
	text-align: left;
}

.terms-nav ul {
	columns: 3 220px;
	column-gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.terms-nav li {
	margin: 0 0 8px;
	break-inside: avoid;
}

.terms-nav a {
	color: var(--color-heading);
	text-decoration: none;
	border-bottom: 1px solid var(--color-border);
}

.terms-nav a:hover,
.terms-nav a:focus-visible {
	color: var(--color-primary);
	border-color: currentColor;
}

.terms-sections .accordion-item {
	scroll-margin-top: calc(var(--masthead-row, 72px) + 20px);
}

.terms-sections .accordion-item-heading {
	text-transform: none;
}

/* Apartments: "Staying Longer Than Two Weeks?" beside its button. */
.rental-longer {
	padding-block: var(--section-space);
	background: var(--color-light-bg);
}

.rental-longer-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 32px;
	align-items: center;
	max-width: 1040px;
}

.rental-longer .section-eyebrow {
	text-align: left;
}

.rental-longer h2 {
	margin: 0 0 12px;
	font-size: clamp(30px, 3vw, 40px);
}

.rental-longer p:not(.section-eyebrow) {
	max-width: 62ch;
	margin: 0;
}

@media (max-width: 760px) {
	.rental-longer-inner {
		grid-template-columns: minmax(0, 1fr);
	}
}

.proposal-form-section {
	padding-block: var(--section-space);
	background: var(--color-light-bg);
	text-align: center;
}

.proposal-form-section .proposal-form {
	max-width: 860px;
	margin: 28px auto 0;
	text-align: left;
}

@media (max-width: 1024px) {
	.benefit-list--3,
	.benefit-list--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.benefit-list,
	.benefit-list--3,
	.benefit-list--4 {
		grid-template-columns: minmax(0, 1fr);
	}
}

[data-theme="dark"] .benefit-list li {
	color: var(--dm-heading);
}

.service-card-bullets {
	flex-grow: 1;
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.service-card-bullets li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text);
}

.service-card-bullets li::before {
	content: "\f058";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: var(--color-primary);
	flex-shrink: 0;
	margin-top: 2px;
}

.service-card > .btn {
	align-self: flex-start;
}

.service-card-price {
	font-size: 13px;
	font-weight: 600;
	color: var(--color-primary);
	margin: -8px 0 16px;
}

.tour-explore-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-top: 40px;
	text-align: left;
}

.tour-explore-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.tour-explore-media {
	position: relative;
	aspect-ratio: 4 / 3;
}

.tour-explore-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tour-explore-media-icon {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-light-bg);
}

.tour-explore-media-icon i {
	font-size: 40px;
	color: var(--color-primary);
}

.tour-explore-grid--pair {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

.tour-explore-grid--quad {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
}

.tour-explore-badge {
	position: absolute;
	top: 14px;
	left: 14px;
	background: var(--color-accent);
	color: var(--color-white);
	font-size: 12px;
	font-weight: 600;
	padding: 5px 12px;
	border-radius: var(--radius-pill);
}

.tour-explore-body .tour-explore-duration {
	font-size: 13px;
	color: var(--color-primary);
	font-weight: 600;
	margin-bottom: 10px;
}

@media (max-width: 600px) {
	.tour-explore-grid--pair,
	.tour-explore-grid--quad {
		grid-template-columns: minmax(0, 1fr);
	}
}

.tour-explore-body {
	padding: 24px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.tour-explore-body h3 {
	font-size: 18px;
	margin-bottom: 10px;
}

.tour-explore-body p {
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text);
	flex-grow: 1;
	margin-bottom: 20px;
}

.tour-explore-body .btn {
	align-self: flex-start;
}

/* Buenos Aires & Argentina page: the destinations+activities grid links
   each whole card through to its relevant existing page, so a soft inline
   text link replaces the usual .btn - six full buttons would compete with
   the page's one real CTA ("Book Holiday in Argentina") below. */
.tour-explore-card--link {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tour-explore-card--link:hover,
.tour-explore-card--link:focus {
	opacity: 1;
}

.tour-explore-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 600;
	color: var(--color-primary);
	align-self: flex-start;
	margin-top: auto;
}

.tour-map-section {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.tour-map-layout {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	gap: 40px;
	align-items: stretch;
}

.tour-map-embed {
	min-height: 380px;
	border-radius: var(--radius-md);
	overflow: hidden;
	border: 1px solid var(--color-border);
}

.tour-map-highlights-list {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.tour-map-highlights-list li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 15px;
	font-weight: 500;
	color: var(--color-heading);
}

.tour-map-highlights-list a {
	display: contents;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}

.tour-map-highlights-list a:hover i,
.tour-map-highlights-list a:focus-visible i {
	background: var(--color-primary-deep);
}

.tour-map-highlights-list i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 14px;
	flex-shrink: 0;
	transition: background-color 0.15s ease;
}

.tour-map-embed--standalone {
	height: 380px;
	max-width: 900px;
	margin: 30px auto 0;
}

/* Buenos Aires & Argentina page: real editorial content ("break content
   into sections") reads as one continuous scroll without extra breathing
   room before each new H2, since the base h2/p rules only add a 20px
   bottom margin - the same gap used between two ordinary paragraphs. */
.page-template-page-buenos-aires-argentina-php .page-content h2 {
	margin-top: 56px;
}

.page-template-page-buenos-aires-argentina-php .page-content h2:first-child {
	margin-top: 0;
}

.tour-groups {
	padding-top: var(--section-space);
}

/* Buenos Aires Tours: intro beside the "something customized?" card. */
.tour-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 360px);
	gap: clamp(28px, 5vw, 72px);
	align-items: center;
	padding-block: var(--section-space) 0;
}

.tour-intro-text p {
	margin: 0;
	font-size: 18px;
	line-height: 1.75;
}

.tour-intro-cta {
	padding: 28px;
	background: var(--color-light-bg);
	border-top: 1px solid var(--color-gold);
}

.tour-intro-cta .section-eyebrow {
	text-align: left;
}

.tour-intro-cta h2 {
	margin: 0 0 18px;
	font-size: 26px;
	line-height: 1.2;
}

/* Tour accordions: serif title, duration on the right, highlights row. */
.tour-item .accordion-item-heading {
	text-transform: none;
}

.tour-item-title {
	flex: 1;
	font-family: var(--font-heading);
	font-size: 22px;
	font-weight: 400;
}

.tour-item-duration {
	font-size: 13px;
	font-weight: 400;
	white-space: nowrap;
	opacity: 0.85;
}

.tour-item .accordion-item-body .tour-item-label {
	margin: 4px 0 10px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.tour-item-highlights {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.tour-item-highlights li {
	font-size: 15px;
	color: var(--color-heading);
}

.tour-item-highlights i {
	margin-right: 6px;
	color: var(--color-gold);
}

.tour-item .accordion-item-body .tour-item-text {
	margin: 0 0 22px;
	font-family: var(--font-heading);
	font-size: 20px;
	line-height: 1.5;
	color: var(--color-heading);
}

.tour-item-book {
	margin-top: 8px;
}

@media (max-width: 800px) {
	.tour-intro {
		grid-template-columns: minmax(0, 1fr);
	}

	.tour-item .accordion-item-heading {
		flex-wrap: wrap;
	}

	.tour-item-title {
		flex-basis: calc(100% - 30px);
		font-size: 20px;
	}
}

.tour-group-heading {
	text-align: left;
	margin: 50px 0 20px;
}

.tour-group-heading:first-child {
	margin-top: 0;
}

@media (max-width: 1024px) {
	.tour-explore-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tour-map-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.tour-map-embed {
		min-height: 300px;
	}
}

@media (max-width: 600px) {
	.tour-explore-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.trust-badge-row {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 20px;
	margin-top: 40px;
}

.trust-badge {
	display: flex;
	align-items: center;
	gap: 16px;
	max-width: 560px;
	padding: 18px 24px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	text-align: left;
}

.trust-badge i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--color-light-bg);
	color: var(--color-primary);
	font-size: 18px;
	flex-shrink: 0;
}

.trust-badge strong {
	display: block;
	font-size: 15px;
	margin-bottom: 2px;
}

.trust-badge span {
	font-size: 13px;
	color: #777;
}

@media (max-width: 480px) {
	.trust-badge {
		flex-direction: column;
		text-align: center;
	}
}

/* Corporate Tango page: a subtle parquet/tile pattern echoes the light-up
   dance-floor visible in the page's own hero photo, and a deep-navy icon
   treatment reads as more "corporate" than the bright-blue service-card
   icons used on the site's consumer-facing pages - both scoped to this one
   section so the shared .service-card component is untouched elsewhere. */
.corporate-cards-section {
	position: relative;
	padding: var(--section-space) 0;
	background-color: var(--color-offwhite);
	background-image: repeating-conic-gradient(rgba(1, 58, 84, 0.035) 0% 25%, transparent 0% 50%);
	background-size: 48px 48px;
	border-top: 3px solid var(--color-sunset);
	border-bottom: 3px solid var(--color-sunset);
}

.corporate-cards-section .service-card-icon {
	background: var(--color-primary-deep);
}

.corporate-cards-section .service-card {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.corporate-cards-section .service-card:hover {
}

.corporate-faq-section {
	padding-block: var(--section-space);
}

.corporate-faq-heading {
	text-align: center;
	margin-bottom: 4px;
}

.corporate-faq-eyebrow {
	text-align: center;
}

.corporate-testimonial-tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--color-primary-deep);
	background: var(--color-sunset-soft);
	padding: 4px 12px;
	border-radius: var(--radius-pill);
	margin-bottom: 10px;
}

@media (max-width: 782px) {
	.corporate-cards-section {
		background-size: 32px 32px;
	}
}

.services-testimonials {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.single-testimonial-section {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
	text-align: center;
}

/* "Read More Traveler Stories" under a page's single testimonial. */
.single-testimonial-more {
	margin: 28px 0 0;
	text-align: center;
}

.single-testimonial-card {
	max-width: 900px;
	margin: 30px auto 0;
	text-align: left;
	border-radius: var(--radius-md);
	overflow: hidden;
}

@media (max-width: 640px) {
	.single-testimonial-card .testimonial-card {
		grid-template-columns: minmax(0, 1fr);
	}
}

.feature-service-section {
	padding: 20px 0 var(--section-space);
}

.feature-service-card {
	max-width: 1000px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
}

.feature-service-media {
	min-height: 280px;
}

.feature-service-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.feature-service-body {
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.feature-service-body h2 {
	margin-bottom: 12px;
}

.feature-service-copy {
	font-size: 18px;
	color: var(--color-text);
	margin-bottom: 24px;
}

.feature-service-body .btn {
	align-self: flex-start;
}

@media (max-width: 700px) {
	.feature-service-card {
		grid-template-columns: minmax(0, 1fr);
	}

	.feature-service-media {
		min-height: 220px;
	}

	.feature-service-body {
		padding: 28px;
	}

	.feature-service-body .btn {
		align-self: stretch;
		text-align: center;
	}
}

.services-cta {
	padding: var(--section-space-lg) 0;
	text-align: center;
	background: var(--color-primary-deep);
	color: var(--color-white);
}

.services-cta h2 {
	color: var(--color-white);
	margin-bottom: 12px;
}

.services-cta p {
	max-width: 560px;
	margin: 0 auto 30px;
	color: rgba(255, 255, 255, 0.85);
}

.services-cta-actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}

@media (max-width: 1024px) {
	.services-cards-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.services-cards-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.services-cta-actions {
		flex-direction: column;
	}

	.services-cta-actions .btn {
		width: 100%;
		justify-content: center;
	}
}

/* -----------------------------------------------------------------------
   22. Jobs page
   ----------------------------------------------------------------------- */
.jobs-roles-section {
	padding: 20px 0 var(--section-space);
}

.jobs-roles-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.job-card {
	display: flex;
	flex-direction: column;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 30px;
}

.job-card h3 {
	font-size: 19px;
	margin-bottom: 10px;
}

.job-card-description {
	font-size: 15px;
	color: var(--color-text);
	margin-bottom: 18px;
}

.job-card-requirements-label {
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--color-heading);
	margin-bottom: 10px;
}

.job-card-requirements {
	flex-grow: 1;
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.job-card-requirements li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text);
}

.job-card-requirements li::before {
	content: "\f058";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: var(--color-primary);
	flex-shrink: 0;
	margin-top: 2px;
}

.job-card > .btn {
	align-self: flex-start;
}

.jobs-apply-note {
	margin-top: 40px;
	padding-top: 30px;
	border-top: 1px solid var(--color-border);
	text-align: center;
}

.jobs-trust-note {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 10px;
	font-size: 14px;
	color: var(--color-text);
}

.jobs-trust-note i {
	color: var(--color-primary);
}

@media (max-width: 600px) {
	.jobs-roles-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -----------------------------------------------------------------------
   23. Press page
   ----------------------------------------------------------------------- */
.press-logos-section {
	padding: 20px 0 var(--section-space);
	text-align: center;
}

.press-logos-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 40px;
	margin-top: 30px;
}

.press-logo-item {
	display: flex;
	align-items: center;
	justify-content: center;
	filter: grayscale(1);
	opacity: 0.75;
	transition: filter 0.2s ease, opacity 0.2s ease;
}

.press-logo-item:hover {
	filter: grayscale(0);
	opacity: 1;
}

.press-logo-item img {
	max-height: 46px;
	width: auto;
}

.press-releases-section {
	padding: 20px 0 var(--section-space);
	background: var(--color-light-bg);
}

.press-releases-section .section-heading {
	margin-bottom: 40px;
}

.press-releases-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.press-release-card {
	display: flex;
	flex-direction: column;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 28px;
}

.press-release-date {
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--color-primary);
	margin-bottom: 10px;
}

.press-release-card h3 {
	font-size: 17px;
	line-height: 1.4;
	margin-bottom: 10px;
}

.press-release-card p {
	flex-grow: 1;
	font-size: 14px;
	color: var(--color-text);
	margin-bottom: 20px;
}

.press-release-card > .btn {
	align-self: flex-start;
}

.press-cta {
	padding: var(--section-space-lg) 0;
	text-align: center;
}

.press-cta p {
	max-width: 560px;
	margin: 0 auto 30px;
	color: var(--color-text);
}

.press-cta-actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}

@media (max-width: 1024px) {
	.press-releases-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.press-releases-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.press-logos-grid {
		gap: 28px;
	}

	.press-logo-item img {
		max-height: 34px;
	}

	.press-cta-actions {
		flex-direction: column;
	}

	.press-cta-actions .btn {
		width: 100%;
		justify-content: center;
	}
}

/* -----------------------------------------------------------------------
   24. Why Us page
   ----------------------------------------------------------------------- */
.whyus-headline-section {
	padding: 50px 0 10px;
	text-align: center;
}

.whyus-bold-headline {
	font-size: clamp(30px, 4vw, 44px);
	margin-bottom: 18px;
}

.whyus-headline-section .page-content {
	max-width: 640px;
	margin: 0 auto;
	color: var(--color-text);
}

.whyus-differentiators-section {
	padding: var(--section-space) 0;
}

.whyus-differentiators-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.whyus-differentiator-card {
	background: var(--color-light-bg);
	border-radius: 0;
	padding: 30px;
	text-align: center;
}

.whyus-differentiator-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 22px;
	margin-bottom: 18px;
}

.whyus-differentiator-card h3 {
	font-size: 17px;
	margin-bottom: 10px;
}

.whyus-differentiator-card p {
	font-size: 14px;
	color: var(--color-text);
	margin: 0;
}

.whyus-testimonials {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.whyus-cta {
	padding: var(--section-space-lg) 0;
	text-align: center;
}

.whyus-cta h2 {
	margin-bottom: 26px;
}

@media (max-width: 1024px) {
	.whyus-differentiators-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 500px) {
	.whyus-differentiators-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -----------------------------------------------------------------------
   25. Testimonials page
   ----------------------------------------------------------------------- */
.testimonials-trust-banner {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 50px;
	padding: 20px 20px 50px;
	text-align: center;
}

.testimonials-trust-item strong {
	display: block;
	font-family: var(--font-heading);
	font-size: 30px;
	color: var(--color-primary);
}

.testimonials-trust-item span {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--color-text);
}

.testimonials-page-section {
	padding: 0 0 var(--section-space);
}

.testimonials-page-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.testimonial-page-card {
	display: flex;
	flex-direction: column;
	background: var(--color-light-bg);
	border: 1px solid var(--color-border);
	border-radius: 0;
	padding: 26px;
}

.testimonial-page-card-icon {
	color: var(--color-primary);
	opacity: 0.35;
	font-size: 20px;
	margin-bottom: 10px;
}

.testimonial-page-card-quote {
	flex-grow: 1;
	font-size: 14px;
	line-height: 1.7;
	color: var(--color-text);
	margin-bottom: 20px;
}

.testimonial-page-card-footer {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
	padding-top: 16px;
	border-top: 1px solid var(--color-border);
}

.testimonial-page-card-footer strong {
	display: block;
	font-size: 14.5px;
}

.testimonial-page-card-footer span {
	font-size: 12.5px;
	color: var(--color-primary);
}

.testimonial-verified-badge {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 600;
	color: #2e9e5b;
	white-space: nowrap;
}

.testimonials-join-cta {
	padding: var(--section-space-lg) 0;
	text-align: center;
	background: var(--color-primary-deep);
	color: var(--color-white);
}

.testimonials-join-cta h2 {
	color: var(--color-white);
	margin-bottom: 12px;
}

.testimonials-join-cta p {
	max-width: 520px;
	margin: 0 auto 28px;
	color: rgba(255, 255, 255, 0.85);
}

@media (max-width: 1024px) {
	.testimonials-page-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.testimonials-page-card-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.testimonials-trust-banner {
		gap: 30px;
	}
}

/* -----------------------------------------------------------------------
   26. Accordion page: optional trailing form (Tango Worldwide)
   ----------------------------------------------------------------------- */
.accordion-form {
	margin-top: 40px;
}

.accordion-form-intro {
	font-weight: 600;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 0.03em;
	color: var(--color-heading);
}

/* -----------------------------------------------------------------------
   27. Generic page: text + image intro layout (e.g. Tango Lesson,
   Personal Tango Partner) - reference uses a 50/50 two-column container
   with the image constrained well below full-column width and shadowed,
   stacking to a single column on mobile.
   ----------------------------------------------------------------------- */
.page-text-image {
	margin-top: 20px;
}

.page-text-image > .wp-block-group__inner-container {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 40px;
}

.page-text-image-text {
	flex: 1 1 calc(50% - 20px);
	min-width: 0;
}

.page-text-image-text ul {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 16px 0 0;
}

.page-text-image-text ul li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 15px;
	line-height: 1.6;
}

.page-text-image-text ul li::before {
	content: "\f058";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: var(--color-primary);
	flex-shrink: 0;
	margin-top: 3px;
}

.page-text-image-image {
	flex: 1 1 calc(50% - 20px);
	min-width: 0;
	text-align: center;
}

.page-text-image-image .wp-block-image img {
	width: 64%;
}

@media (max-width: 767px) {
	.page-text-image > .wp-block-group__inner-container {
		flex-direction: column;
	}

	.page-text-image-image .wp-block-image img {
		width: 100%;
	}
}

/* Service pages with a short intro (Tango Practice Partner, Tango Shows):
   the photo is cropped to a landscape the height of the text beside it, so
   the section below - what the page actually offers - is in view when a
   visitor lands, instead of sitting under a tall portrait. */
.page-intro-tight {
	padding-top: 48px;
	padding-bottom: 8px;
}

.page-intro-tight .page-text-image > .wp-block-group__inner-container {
	align-items: center;
}

.page-intro-tight .page-text-image-image .wp-block-image {
	margin: 0;
}

.page-intro-tight .page-text-image-image .wp-block-image img {
	width: 100%;
	aspect-ratio: 16 / 10;
	max-height: 320px;
	object-fit: cover;
}

/* -----------------------------------------------------------------------
   28. Form radio/checkbox groups (Tailor Made Packages)
   ----------------------------------------------------------------------- */
.form-section-heading {
	width: 100%;
	margin: 10px 0 16px;
	font-size: 20px;
}

.form-field-options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
}

.form-field-option {
	display: flex !important;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 400 !important;
	margin-bottom: 0 !important;
	width: auto;
}

.form-field-option input {
	width: auto;
}

/* -----------------------------------------------------------------------
   29. Apartments Rental page
   ----------------------------------------------------------------------- */
.rental-intro {
	max-width: 1100px;
	margin: 0 auto;
	padding: 40px 20px 0;
	text-align: center;
}

.rental-form-heading {
	max-width: 1100px;
	margin: 30px auto 0;
	padding: 0 20px;
	text-align: center;
	font-size: 21px;
}

/* -----------------------------------------------------------------------
   30. Facts About Argentina page
   ----------------------------------------------------------------------- */
.fact-category-section {
	padding: 50px 0;
}

.fact-category-section:nth-child(even) {
	background: var(--color-light-bg);
}

.fact-category-heading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin-bottom: 10px;
}

.fact-category-heading .section-heading {
	margin-bottom: 0;
}

.fact-category-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 18px;
	flex-shrink: 0;
}

.fact-category-section--culture .fact-category-icon,
.fact-category-section--culture .fact-tile-icon {
	background: var(--color-sunset);
}

.fact-category-section--tango .fact-category-icon,
.fact-category-section--tango .fact-tile-icon {
	background: var(--color-accent);
}

.fact-category-section--economy .fact-category-icon,
.fact-category-section--economy .fact-tile-icon {
	background: var(--color-primary-deep);
}

.fact-tile-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 30px;
}

.fact-tile {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 18px 20px;
}

.fact-tile-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 15px;
	flex-shrink: 0;
}

.fact-tile-label {
	font-weight: 600;
	font-size: 13px;
	color: var(--color-heading);
	margin: 0 0 4px;
}

.fact-tile-value {
	font-size: 14px;
	line-height: 1.5;
	color: var(--color-text);
	margin: 0;
}

@media (max-width: 1024px) {
	.fact-tile-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.fact-tile-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.fact-category-heading {
		flex-direction: column;
		gap: 8px;
	}
}

/* -----------------------------------------------------------------------
   31. Useful Information page
   ----------------------------------------------------------------------- */
.info-card {
	max-width: 950px;
	margin: 50px auto;
	padding: 40px;
	border-radius: var(--radius-md);
	background: var(--color-light-bg);
	border: 1px solid var(--color-border);
	font-family: var(--font-body);
}

.info-title {
	text-align: center;
	font-family: var(--font-heading);
	font-size: 28px;
	margin-bottom: 30px;
	color: var(--color-heading);
}

.info-section {
	margin-bottom: 30px;
}

.info-section h3 {
	margin-bottom: 15px;
	color: var(--color-heading);
	font-family: var(--font-accent);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	border-left: 3px solid var(--color-gold);
	padding-left: 12px;
}

.info-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px;
}

.info-item {
	background: var(--color-white);
	padding: 14px 16px;
	border-radius: var(--radius-sm);
	border: 1px solid var(--color-border);
	border-left: 3px solid var(--color-primary);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.info-item span {
	display: block;
	font-size: 13px;
	color: var(--color-text);
	opacity: 0.7;
	margin-bottom: 5px;
	font-weight: 600;
}

.info-item p {
	margin: 0;
	font-size: 14px;
	color: var(--color-text);
}

.info-item:hover {
	border-left-color: var(--color-gold);
}

@media (max-width: 768px) {
	.info-grid {
		grid-template-columns: 1fr;
	}
}

/* -----------------------------------------------------------------------
   32. Weather page
   ----------------------------------------------------------------------- */
.weather-embed-wrapper {
	max-width: 1000px;
	width: 100%;
	margin: 40px auto;
	border-radius: 0;
	overflow: hidden;
	background: #000000;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.3);
	position: relative;
	transition: all 0.3s ease;
}

@media (hover: hover) {
	.weather-embed-wrapper:hover {
		transform: translateY(-6px);
		box-shadow: 0 25px 70px rgba(0, 0, 0, 0.25);
	}
}

.weather-embed-wrapper iframe {
	width: 100%;
	height: 720px;
	border: none;
	display: block;
	position: relative;
	z-index: 2;
}

@media (max-width: 992px) {
	.weather-embed-wrapper {
		margin: 25px 15px;
		border-radius: 0;
	}

	.weather-embed-wrapper iframe {
		height: 620px;
	}
}

@media (max-width: 768px) {
	.weather-embed-wrapper {
		margin: 18px 10px;
		border-radius: 0;
	}

	.weather-embed-wrapper iframe {
		height: 520px;
	}
}

@media (max-width: 480px) {
	.weather-embed-wrapper {
		margin: 15px 8px;
		border-radius: 0;
	}

	.weather-embed-wrapper iframe {
		height: 460px;
	}
}

.weather-seasons-section {
	padding: 20px 0 var(--section-space);
}

.season-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	margin-top: 40px;
	text-align: left;
}

.season-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 28px;
}

.season-card-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 22px;
}

.season-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 20px;
	flex-shrink: 0;
}

.season-accent-sunset {
	background: var(--color-sunset);
}

.season-accent-primary-deep {
	background: var(--color-primary-deep);
}

.season-accent-accent {
	background: var(--color-accent);
}

.season-card-header h3 {
	margin: 0 0 2px;
	font-size: 19px;
}

.season-card-months {
	margin: 0;
	font-size: 13px;
	color: var(--color-text);
	opacity: 0.75;
}

.season-stat-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.season-stat-list li {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 10px;
	font-size: 14px;
	line-height: 1.5;
}

.season-stat-list i {
	width: 18px;
	text-align: center;
	color: var(--color-primary);
	flex-shrink: 0;
	align-self: center;
}

.season-stat-label {
	font-weight: 600;
	color: var(--color-heading);
	flex: 0 0 auto;
}

.season-stat-value {
	color: var(--color-text);
}

@media (max-width: 700px) {
	.season-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 480px) {
	.season-card {
		padding: 20px;
	}
}

/* -----------------------------------------------------------------------
   33. Currency Conversion page
   ----------------------------------------------------------------------- */
.currency-wrapper {
	max-width: 1000px;
	margin: 30px auto;
	font-family: var(--font-body);
}

.currency-wrapper .top-note {
	background: var(--color-light-bg);
	border-left: 3px solid var(--color-gold);
	padding: 14px 18px;
	border-radius: var(--radius-sm);
	margin-bottom: 20px;
	font-size: 14px;
	color: var(--color-text);
}

.currency-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
}

.currency-table thead {
	background: var(--color-navy);
	color: var(--color-white);
}

.currency-table th {
	padding: 14px;
	text-align: left;
	font-family: var(--font-accent);
	font-size: 12.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.currency-table td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--color-border);
	font-size: 14px;
	color: var(--color-text);
}

.currency-table tbody tr:nth-child(even) {
	background: var(--color-light-bg);
}

.currency-table tbody tr:hover {
	background: var(--color-gold-soft);
}

.currency-table td:nth-child(2) {
	font-weight: 700;
	color: var(--color-primary);
}

.currency-wrapper .code {
	color: var(--color-text);
	opacity: 0.65;
	font-size: 12px;
	margin-left: 4px;
}

@media (max-width: 768px) {
	.currency-table th,
	.currency-table td {
		font-size: 12px;
		padding: 8px;
	}
}

/* -----------------------------------------------------------------------
   34. Verify Order Details page (Tour Package checkout)
   ----------------------------------------------------------------------- */
.verify-order-page {
	padding: var(--section-space) 20px;
}

.verify-order-page .form-notice {
	max-width: none;
}

.verify-order-heading {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 8px 0 20px;
	padding-bottom: 10px;
	font-size: 19px;
	font-weight: 600;
	color: var(--color-heading);
	border-bottom: 2px solid var(--color-border);
}

.verify-order-heading:not(:first-child) {
	margin-top: 36px;
}

.verify-order-heading i {
	color: var(--color-primary);
	font-size: 16px;
}

.verify-order-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 340px);
	align-items: start;
	gap: 40px;
	max-width: 1100px;
	margin: 0 auto;
}

.verify-order-main {
	min-width: 0;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 32px 36px 8px;
	box-shadow: 0 4px 20px rgba(3, 24, 27, 0.05);
}

.package-details-box {
	width: 100%;
	margin: 0 0 8px;
	padding: 20px 20px 20px;
	background: var(--color-offwhite);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}

.package-details-box .form-field--w100 input {
	max-width: 160px;
}

.package-details-summary {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 40px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px dashed var(--color-border);
}

.package-details-summary-item {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.package-details-summary-label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #888;
}

.package-details-summary-label i {
	color: var(--color-primary);
}

.package-details-summary-value {
	font-size: 16px;
	font-weight: 600;
	color: var(--color-heading);
}

.package-price-note {
	width: 100%;
	margin: 0 0 18px;
	font-size: 13px;
	line-height: 1.6;
	color: #666;
}

.verify-order-sidebar {
	position: sticky;
	top: 20px;
}

.order-summary-card {
	background: var(--color-white);
	border-radius: var(--radius-md);
	padding: 28px 26px;
	box-shadow: 0 10px 30px rgba(3, 24, 27, 0.1);
	border-top: 4px solid var(--color-primary);
}

.order-summary-card h3 {
	margin: 0 0 20px;
	font-size: 18px;
	font-weight: 600;
	color: var(--color-heading);
}

.order-summary-card .form-field {
	margin-bottom: 16px;
}

.order-summary-card .booking-review-price {
	margin: 16px 0 20px;
}

.pay-full-toggle {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 2px 0 14px;
	font-size: 13.5px;
	line-height: 1.5;
	color: #555;
	cursor: pointer;
}

.pay-full-toggle input {
	width: 16px;
	height: 16px;
	margin-top: 2px;
	flex-shrink: 0;
	accent-color: var(--color-primary);
	cursor: pointer;
}

.verify-order-payment-methods {
	margin: 20px 0 4px;
	padding-top: 18px;
	border-top: 1px solid var(--color-border);
}

.verify-order-payment-methods h4 {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #888;
}

.verify-order-payment-methods .wc_payment_methods {
	margin-bottom: 0;
}

.verify-order-payment-methods .wc_payment_method {
	padding: 12px 14px;
}

.order-summary-submit {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	margin-top: 16px;
	padding: 16px 20px;
	font-size: 16px;
}

.order-summary-trust {
	list-style: none;
	margin: 20px 0 0;
	padding: 18px 0 0;
	border-top: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.order-summary-trust li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 12.5px;
	line-height: 1.5;
	color: #666;
}

.order-summary-trust i {
	margin-top: 2px;
	color: var(--color-primary);
	flex-shrink: 0;
}

.order-summary-trust a {
	color: var(--color-primary);
}

@media (max-width: 900px) {
	.verify-order-layout {
		grid-template-columns: 1fr;
	}

	.verify-order-sidebar {
		position: static;
		order: -1;
	}

	.verify-order-main {
		padding: 24px 20px 4px;
	}
}

/* -----------------------------------------------------------------------
   35. Booking Review page (replaces the default WooCommerce Cart page)
   ----------------------------------------------------------------------- */
.booking-review-page {
	padding: var(--section-space) 20px;
}

.booking-review-empty {
	max-width: 480px;
	margin: 0 auto;
	padding: 60px 30px;
	text-align: center;
}

.booking-review-empty i {
	font-size: 40px;
	color: var(--color-primary);
	margin-bottom: 16px;
}

.booking-review-empty h2 {
	margin-bottom: 10px;
}

.booking-review-empty p {
	margin-bottom: 26px;
	color: #666;
}

.booking-review-card {
	max-width: 720px;
	margin: 0 auto;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 40px 44px;
	box-shadow: 0 10px 30px rgba(3, 24, 27, 0.08);
}

.booking-review-header {
	text-align: center;
	margin-bottom: 30px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--color-border);
}

.booking-review-header h2 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-bottom: 8px;
	font-size: 24px;
}

.booking-review-header h2 i {
	color: var(--color-primary);
	font-size: 20px;
}

.booking-review-header p {
	color: #666;
	font-size: 14px;
}

.booking-review-section {
	margin-bottom: 28px;
}

.booking-review-section h3 {
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.6px;
	color: var(--color-primary);
	margin-bottom: 14px;
}

.booking-review-list {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 14px 24px;
	margin: 0;
}

.booking-review-list > div {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.booking-review-list dt {
	font-size: 12px;
	color: #888;
}

.booking-review-list dd {
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--color-heading);
}

.booking-review-price {
	margin: 30px 0;
	padding: 22px 24px;
	background: var(--color-offwhite);
	border-radius: var(--radius-sm);
}

.booking-review-price > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 15px;
	padding: 6px 0;
}

.booking-review-price-due {
	margin-top: 6px;
	padding-top: 14px !important;
	border-top: 1px dashed var(--color-border);
}

.booking-review-price-due span {
	font-weight: 600;
	color: var(--color-heading);
}

.booking-review-price-due em {
	font-style: normal;
	color: #888;
	font-weight: 400;
}

.booking-review-price-due strong {
	font-size: 24px;
	color: var(--color-primary);
}

.booking-review-price p {
	margin: 10px 0 0;
	font-size: 12.5px;
	color: #666;
}

.booking-review-actions {
	display: flex;
	gap: 16px;
	margin-bottom: 26px;
}

.booking-review-actions .btn {
	flex: 1;
	justify-content: center;
}

.booking-review-payment-form {
	display: flex;
	flex: 1;
}

.booking-review-payment-form .btn {
	width: 100%;
	border: none;
	cursor: pointer;
	font-size: inherit;
}

.booking-review-submit {
	display: flex;
	align-items: center;
	gap: 8px;
}

.booking-review-trust {
	margin: 0;
	padding-top: 20px;
	border-top: 1px solid var(--color-border);
}

@media (max-width: 600px) {
	.booking-review-card {
		padding: 28px 22px;
	}

	.booking-review-list {
		grid-template-columns: minmax(0, 1fr);
	}

	.booking-review-actions {
		flex-direction: column;
	}
}

/* -----------------------------------------------------------------------
   36. WooCommerce Checkout page - re-skins the block checkout's payment
   gateway selector, form fields, order summary and Place Order button to
   match the rest of the site instead of WooCommerce's bare default look.
   The checkout itself (fields, gateway list, order placement) is still
   entirely WooCommerce's own - only colors/radius/type are touched here,
   never layout, so its behaviour stays intact. Several rules need
   !important since wc-blocks-style-css sets these with equal or higher
   specificity and loads after this stylesheet.
   ----------------------------------------------------------------------- */
.woocommerce-checkout .wc-block-components-checkout-step__title {
	font-family: var(--font-heading);
	font-size: 19px;
	color: var(--color-heading);
}

.woocommerce-checkout .wc-block-components-text-input input,
.woocommerce-checkout .wc-blocks-components-select__select {
	border-radius: var(--radius-sm) !important;
	border-color: var(--color-border) !important;
	font-family: var(--font-body);
}

.woocommerce-checkout .wc-block-components-text-input input:focus,
.woocommerce-checkout .wc-blocks-components-select__select:focus {
	border-color: var(--color-primary) !important;
	outline: 2px solid var(--color-primary);
	outline-offset: 1px;
}

.woocommerce-checkout .wc-block-components-radio-control__option {
	border-radius: var(--radius-sm) !important;
	border-color: var(--color-border) !important;
}

.woocommerce-checkout .wc-block-components-radio-control__option-checked {
	border-color: var(--color-primary) !important;
	background: var(--color-offwhite);
	box-shadow: none !important;
}

.woocommerce-checkout .wc-block-components-radio-control__input:checked {
	background-color: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
}

.woocommerce-checkout .wc-block-components-payment-method-label {
	font-weight: 600;
	color: var(--color-heading);
}

.woocommerce-checkout .wc-block-components-checkout-place-order-button {
	background: var(--color-cta) !important;
	border-color: var(--color-cta) !important;
	border-radius: var(--radius-pill) !important;
	font-family: var(--font-body);
	font-weight: 600;
}

.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover,
.woocommerce-checkout .wc-block-components-checkout-place-order-button:focus {
	opacity: 0.9;
}

.woocommerce-checkout .wc-block-components-order-summary,
.woocommerce-checkout .wc-block-components-totals-wrapper,
.woocommerce-checkout .wc-block-components-panel {
	border-radius: var(--radius-md);
	border-color: var(--color-border) !important;
}

.woocommerce-checkout .wc-block-components-checkout-order-summary__title,
.woocommerce-checkout .wc-block-components-product-name {
	font-family: var(--font-heading);
}

.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--color-primary);
	font-weight: 700;
	font-size: 20px;
}

/* -----------------------------------------------------------------------
   37. Payment page (page-book-now-payment.php) - the custom gateway picker
   that replaces WooCommerce's Checkout page for this site. Reuses
   WooCommerce's own payment-method markup/classes (wc_payment_methods,
   payment_box, etc.) so third-party gateway plugins that target those
   selectors keep working; only visual styling is added here.
   ----------------------------------------------------------------------- */
.wc_payment_methods {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
}

.wc_payment_method {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	padding: 16px 18px;
	margin-bottom: 12px;
}

.wc_payment_method + .wc_payment_method {
	margin-top: 0;
}

.wc_payment_method input.input-radio {
	width: 16px;
	height: 16px;
	margin-right: 8px;
	accent-color: var(--color-primary);
}

.wc_payment_method label {
	font-weight: 600;
	color: var(--color-heading);
	cursor: pointer;
}

.wc_payment_method .payment_box {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--color-border);
	font-size: 14.5px;
	color: #555;
}

.wc_payment_method .payment_box p {
	margin: 0 0 10px;
}

.wc-pay-form .form-row {
	margin-top: 4px;
}

.wc-pay-form #place_order {
	width: 100%;
	justify-content: center;
	display: flex;
	align-items: center;
	gap: 8px;
	border: none;
	cursor: pointer;
	font-size: inherit;
}

.wc-pay-form #place_order:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* -----------------------------------------------------------------------
   38. My Account page - re-skins WooCommerce's classic My Account
   templates (dashboard, orders, addresses, account details, login/
   register, and the custom "My Bookings" tab added in inc/woocommerce.php)
   to match the rest of the site instead of WooCommerce's bare default
   look. Structure/behaviour is untouched, only layout and visual styling.
   ----------------------------------------------------------------------- */
body.woocommerce-account .page-content.container > .woocommerce:has(.woocommerce-MyAccount-navigation) {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 36px;
	align-items: start;
}

.woocommerce-MyAccount-navigation {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 10px;
	position: sticky;
	top: 20px;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-MyAccount-navigation-link {
	margin-bottom: 2px;
}

.woocommerce-MyAccount-navigation-link a {
	display: block;
	padding: 12px 16px;
	border-radius: var(--radius-sm);
	color: var(--color-heading);
	font-weight: 600;
	font-size: 14.5px;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.woocommerce-MyAccount-navigation-link a:hover {
	background: var(--color-offwhite);
}

.woocommerce-MyAccount-navigation-link.is-active a {
	background: var(--color-cta);
	color: var(--color-white);
}

.woocommerce-MyAccount-navigation-link--customer-logout {
	margin-top: 8px;
	border-top: 1px solid var(--color-border);
	padding-top: 8px;
}

.woocommerce-MyAccount-content {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 32px 36px;
	box-shadow: 0 4px 20px rgba(3, 24, 27, 0.05);
}

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
	font-family: var(--font-heading);
	color: var(--color-heading);
	margin-top: 0;
}

.woocommerce-MyAccount-content a {
	color: var(--color-primary);
}

body.woocommerce-account .woocommerce table.shop_table {
	width: 100%;
	border-collapse: collapse;
	margin: 18px 0;
	font-size: 14.5px;
}

body.woocommerce-account .woocommerce table.shop_table th {
	text-align: left;
	padding: 12px 14px;
	background: var(--color-offwhite);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #888;
	border-bottom: 1px solid var(--color-border);
}

body.woocommerce-account .woocommerce table.shop_table td {
	padding: 14px;
	border-bottom: 1px solid var(--color-border);
	color: var(--color-heading);
}

body.woocommerce-account .woocommerce .button,
body.woocommerce-account .woocommerce .woocommerce-Button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 9px 20px;
	border-radius: var(--radius-pill);
	background: var(--color-cta);
	color: var(--color-white) !important;
	font-weight: 600;
	font-size: 13px;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: opacity 0.15s ease;
}

body.woocommerce-account .woocommerce .button:hover,
body.woocommerce-account .woocommerce .woocommerce-Button:hover {
	opacity: 0.9;
}

body.woocommerce-account .woocommerce .woocommerce-pagination {
	margin-top: 16px;
}

body.woocommerce-account .woocommerce .woocommerce-form-row,
body.woocommerce-account .woocommerce .form-row {
	margin-bottom: 18px;
}

body.woocommerce-account .woocommerce label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
	font-size: 13.5px;
	color: var(--color-heading);
}

body.woocommerce-account .woocommerce .woocommerce-Input,
body.woocommerce-account .woocommerce input.input-text,
body.woocommerce-account .woocommerce select {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-family: var(--font-body);
	font-size: 14.5px;
}

body.woocommerce-account .woocommerce .woocommerce-Input:focus,
body.woocommerce-account .woocommerce input.input-text:focus,
body.woocommerce-account .woocommerce select:focus {
	border-color: var(--color-primary);
	outline: 2px solid var(--color-primary);
	outline-offset: 1px;
}

body.woocommerce-account .woocommerce fieldset {
	margin: 20px 0;
	padding: 20px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}

body.woocommerce-account .woocommerce fieldset legend {
	padding: 0 8px;
	font-weight: 700;
	color: var(--color-heading);
}

/* Login/Register (logged-out visit to My Account) */

/* Registration is off by default (see woocommerce_enable_myaccount_registration)
   so this is normally just the Login form on its own - centre it as a
   single professional card instead of a plain heading + full-width form. */
body.woocommerce-account .woocommerce:not(:has(.woocommerce-MyAccount-navigation)):not(:has(#customer_login)) {
	max-width: 440px;
	margin: 0 auto;
	text-align: center;
}

body.woocommerce-account .woocommerce:not(:has(.woocommerce-MyAccount-navigation)):not(:has(#customer_login)) > h2 {
	text-align: center;
}

/* If registration ever gets switched on, Login/Register sit side by side
   in equal-width cards instead. */
#customer_login.u-columns {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	align-items: stretch;
}

#customer_login .u-column1,
#customer_login .u-column2 {
	flex: 1 1 300px;
	min-width: 0;
}

#customer_login h2 {
	margin-bottom: 18px;
}

.woocommerce-form-login,
.woocommerce-form-register {
	text-align: left;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 4px solid var(--color-primary);
	border-radius: var(--radius-md);
	padding: 36px 32px;
	box-shadow: 0 10px 30px rgba(3, 24, 27, 0.08);
}

.woocommerce-form-login .form-row:has(#username),
.woocommerce-form-login .form-row:has(#password),
.woocommerce-form-register .form-row:has(#reg_email) {
	position: relative;
}

.woocommerce-form-login .form-row:has(#username) input,
.woocommerce-form-login .form-row:has(#password) input,
.woocommerce-form-register .form-row:has(#reg_email) input {
	padding-left: 42px;
}

.woocommerce-form-login .form-row:has(#username)::after,
.woocommerce-form-login .form-row:has(#password)::after,
.woocommerce-form-register .form-row:has(#reg_email)::after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	position: absolute;
	left: 14px;
	bottom: 13px;
	color: #aaa;
	font-size: 14px;
	pointer-events: none;
}

.woocommerce-form-login .form-row:has(#username)::after,
.woocommerce-form-register .form-row:has(#reg_email)::after {
	content: "\f007";
}

.woocommerce-form-login .form-row:has(#password)::after {
	content: "\f023";
}

.woocommerce-form__input-checkbox {
	width: auto;
	display: inline-block;
	margin-right: 6px;
}

.woocommerce-form-login__rememberme {
	display: flex;
	align-items: center;
	font-weight: 400;
	font-size: 13.5px;
	margin-bottom: 18px;
}

.woocommerce-form-login .woocommerce-button,
.woocommerce-form-register .woocommerce-button {
	width: 100%;
}

.woocommerce-LostPassword {
	margin: 16px 0 0;
	text-align: center;
	font-size: 13.5px;
}

/* Order status pill (Orders tab) */
.wc-order-status-badge {
	display: inline-block;
	padding: 4px 12px;
	border-radius: var(--radius-pill);
	font-size: 12px;
	font-weight: 700;
	background: #f0f0f1;
	color: #50575e;
	white-space: nowrap;
}

.wc-order-status-badge--processing,
.wc-order-status-badge--completed {
	background: #dff5e1;
	color: #1a6b34;
}

.wc-order-status-badge--on-hold,
.wc-order-status-badge--pending {
	background: #fdf0d5;
	color: #8a5a00;
}

.wc-order-status-badge--cancelled,
.wc-order-status-badge--failed {
	background: #fbe1e1;
	color: #a3232f;
}

.wc-order-status-badge--refunded {
	background: #ececec;
	color: #666;
}

/* Booking status pill (My Bookings tab) - same palette as the wp-admin
   Enquiry list's .enquiry-status-badge (see
   argentina_tango_enquiry_status_admin_css() in inc/custom-post-types.php),
   duplicated here since that CSS only loads in wp-admin. */
.enquiry-status-badge {
	display: inline-block;
	padding: 4px 12px;
	border-radius: var(--radius-pill);
	font-size: 12px;
	font-weight: 700;
	background: #f0f0f1;
	color: #50575e;
	white-space: nowrap;
}

.enquiry-status-badge--in_progress {
	background: #e2ecfb;
	color: #1a4d8f;
}

.enquiry-status-badge--deposit_requested {
	background: #fdf0d5;
	color: #8a5a00;
}

.enquiry-status-badge--confirmed {
	background: #dff5e1;
	color: #1a6b34;
}

.enquiry-status-badge--closed {
	background: #ececec;
	color: #666;
}

.my-bookings {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.my-booking-card {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	padding: 20px 22px;
	background: var(--color-offwhite);
}

.my-booking-card-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 14px;
}

.my-booking-card-header h3 {
	margin: 0;
	font-size: 17px;
}

.my-booking-card-details {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 12px 24px;
	margin: 0;
}

.my-booking-card-details dt {
	margin: 0 0 2px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #888;
}

.my-booking-card-details dd {
	margin: 0;
	font-size: 14.5px;
	font-weight: 500;
	color: var(--color-heading);
}

.my-booking-toggle {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 16px;
	padding: 8px 16px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-pill);
	color: var(--color-primary);
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.my-booking-toggle:hover {
	background: var(--color-cta);
	border-color: var(--color-cta);
	color: var(--color-white);
}

.my-booking-toggle.is-active {
	background: var(--color-cta);
	border-color: var(--color-cta);
	color: var(--color-white);
}

.my-booking-details {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px dashed var(--color-border);
}

.my-booking-details .my-booking-card-details {
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

/* Dashboard tab (woocommerce/myaccount/dashboard.php) */
.my-account-welcome {
	padding-bottom: 24px;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--color-border);
}

.my-account-welcome h2 {
	margin: 0 0 8px;
}

.my-account-welcome h2 span {
	color: var(--color-primary);
}

.my-account-welcome p {
	margin: 0;
	color: #666;
}

.my-account-quick-links {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 18px;
}

.my-account-quick-link {
	display: block;
	padding: 24px 20px;
	background: var(--color-offwhite);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	text-decoration: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.my-account-quick-link:hover {
	border-color: var(--color-primary);
	box-shadow: 0 8px 20px rgba(3, 24, 27, 0.08);
	transform: translateY(-2px);
}

.my-account-quick-link i {
	font-size: 22px;
	color: var(--color-primary);
}

.my-account-quick-link h3 {
	margin: 14px 0 6px;
	font-size: 16px;
	color: var(--color-heading);
}

.my-account-quick-link p {
	margin: 0;
	font-size: 13.5px;
	color: #666;
}

@media (max-width: 782px) {
	body.woocommerce-account .page-content.container > .woocommerce:has(.woocommerce-MyAccount-navigation) {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.woocommerce-MyAccount-navigation {
		position: static;
	}

	.woocommerce-MyAccount-navigation ul {
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
	}

	.woocommerce-MyAccount-navigation-link {
		margin-bottom: 0;
	}

	.woocommerce-MyAccount-navigation-link--customer-logout {
		margin-top: 0;
		border-top: none;
		padding-top: 0;
	}

	.woocommerce-MyAccount-content {
		padding: 24px 20px;
	}

	#customer_login.u-columns {
		flex-direction: column;
	}
}

/* -----------------------------------------------------------------------
   39. Thank You / order-received page - re-skins WooCommerce's default
   checkout/order-received.php + order/order-details*.php templates
   (success banner is a theme override, everything else below is pure
   CSS on top of WooCommerce's stock markup).
   ----------------------------------------------------------------------- */
body.woocommerce-order-received .page-content.container {
	max-width: 900px;
}

.woocommerce-order {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 44px 48px;
	box-shadow: 0 4px 20px rgba(3, 24, 27, 0.05);
}

.argentina-order-success {
	text-align: center;
	padding-bottom: 32px;
	margin-bottom: 32px;
	border-bottom: 1px solid var(--color-border);
}

.argentina-order-success-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: #e8f8ee;
	color: #1fa864;
	font-size: 28px;
	margin-bottom: 18px;
}

.argentina-order-success-title {
	margin: 0 0 10px;
}

.argentina-order-success-text {
	max-width: 480px;
	margin: 0 auto;
	color: #666;
}

.woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	list-style: none;
	margin: 0 0 36px;
	padding: 0;
	background: var(--color-border);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	overflow: hidden;
}

.woocommerce-order-overview li {
	background: var(--color-offwhite);
	padding: 18px 20px;
	text-align: center;
	font-size: 12.5px;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #888;
}

.woocommerce-order-overview li strong {
	display: block;
	overflow-wrap: break-word;
	margin-top: 6px;
	font-size: 15.5px;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	color: var(--color-heading);
}

.woocommerce-order-details__title,
.woocommerce-column__title {
	font-family: var(--font-heading);
	color: var(--color-heading);
	font-size: 20px;
	margin: 0 0 16px;
}

body.woocommerce-order-received table.shop_table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 8px;
	font-size: 14.5px;
}

body.woocommerce-order-received table.shop_table th {
	text-align: left;
	padding: 12px 14px;
	background: var(--color-offwhite);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #666;
}

body.woocommerce-order-received table.shop_table td {
	padding: 14px;
	border-bottom: 1px solid var(--color-border);
	vertical-align: top;
}

body.woocommerce-order-received table.shop_table {
	table-layout: fixed;
}

body.woocommerce-order-received table.shop_table th,
body.woocommerce-order-received table.shop_table td {
	overflow-wrap: break-word;
}

body.woocommerce-order-received table.shop_table th:last-child,
body.woocommerce-order-received table.shop_table td:last-child {
	width: 160px;
	text-align: right;
}

body.woocommerce-order-received table.shop_table tfoot th,
body.woocommerce-order-received table.shop_table tfoot td {
	border-bottom: none;
	background: none;
}

body.woocommerce-order-received table.shop_table tfoot tr:first-child th,
body.woocommerce-order-received table.shop_table tfoot tr:first-child td {
	border-top: 1px solid var(--color-border);
	padding-top: 16px;
}

.wc-item-meta {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	font-size: 13.5px;
	color: #666;
}

.wc-item-meta-label {
	color: var(--color-heading);
}

.woocommerce-customer-details {
	margin-top: 40px;
}

.woocommerce-customer-details .woocommerce-columns--addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 24px;
}

.woocommerce-customer-details address {
	font-style: normal;
	background: var(--color-offwhite);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	padding: 18px 20px;
	line-height: 1.7;
	font-size: 14.5px;
}

.argentina-order-actions {
	display: flex;
	justify-content: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-top: 40px;
}

@media (max-width: 767px) {
	.woocommerce-order {
		padding: 32px 22px;
	}

	.woocommerce-order-overview {
		grid-template-columns: 1fr;
	}

	.argentina-order-actions .btn {
		width: 100%;
		justify-content: center;
	}

	body.woocommerce-order-received table.shop_table th:last-child,
	body.woocommerce-order-received table.shop_table td:last-child {
		width: 90px;
	}
}

/* Each neighborhood gets one consistent accent color, shared by its card
   icon and its pin in the "Jump to a Neighborhood" map list, so the two are
   visually linked without introducing any new colors. */
.page-template-page-buenos-aires-neighborhood-php .hood-accent-primary {
	background: var(--color-primary);
}

.page-template-page-buenos-aires-neighborhood-php .hood-accent-sunset {
	background: var(--color-sunset);
}

.page-template-page-buenos-aires-neighborhood-php .hood-accent-primary-deep {
	background: var(--color-primary-deep);
}

.page-template-page-buenos-aires-neighborhood-php .hood-accent-accent {
	background: var(--color-accent);
}

.page-template-page-buenos-aires-neighborhood-php .hood-card {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.page-template-page-buenos-aires-neighborhood-php .hood-card:hover {
}

/* -----------------------------------------------------------------------
   34. Dark mode
   ----------------------------------------------------------------------- */
/* --color-text, --color-muted and --color-border are single-purpose tokens
   (body copy, secondary copy, hairlines), so they flip at the root. Tokens
   such as --color-heading, --color-white and --color-navy double as fills
   and as text on photographs, so they are left alone and the surfaces that
   use them are re-coloured explicitly below. Coverage is global chrome
   (header, footer, page hero) plus the homepage; secondary content pages
   may still show light surfaces in dark mode and would need their own
   pass. */
:root[data-theme="dark"] {
	--color-cta: #eef1f3;
	--color-cta-text: #0e1c29;
	--color-text: #c3ccd2;
	--color-muted: #8c979e;
	--color-border: #26333e;
	--dm-bg: #10171d;
	--dm-surface: #151f28;
	--dm-heading: #eef1f3;
}

[data-theme="dark"] body {
	background: var(--dm-bg);
}

[data-theme="dark"] .home-intro {
	--home-intro-bg: var(--dm-bg);
}

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] .section-heading,
[data-theme="dark"] .page-hero-title {
	color: var(--dm-heading);
}

/* Header */
[data-theme="dark"] .site-header,
[data-theme="dark"] .has-overlay-header .site-header.is-scrolled {
	background: var(--dm-bg);
	border-bottom-color: var(--color-border);
}

[data-theme="dark"] .has-overlay-header .site-header:not(.is-scrolled) {
	background: transparent;
	border-bottom-color: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .header-promo,
[data-theme="dark"] .lang-switcher-toggle,
[data-theme="dark"] .theme-toggle,
[data-theme="dark"] .menu-toggle {
	color: var(--dm-heading);
}

[data-theme="dark"] .site-branding img,
[data-theme="dark"] .custom-logo {
	filter: brightness(0) invert(1);
}

[data-theme="dark"] .lang-switcher-menu {
	background: var(--dm-surface);
	border-color: var(--color-border);
}

[data-theme="dark"] .lang-switcher-menu button {
	color: var(--color-text);
}

[data-theme="dark"] .lang-switcher-menu button:hover {
	background: var(--dm-bg);
}

/* Buttons and links that are ink-on-light in the light theme. */
[data-theme="dark"] .btn-outline,
[data-theme="dark"] .packages-table .btn-outline.btn-small {
	color: var(--dm-heading);
	border-color: rgba(255, 255, 255, 0.55);
}

[data-theme="dark"] .btn-outline:hover,
[data-theme="dark"] .btn-outline:focus,
[data-theme="dark"] .packages-table .btn-outline.btn-small:hover {
	background: var(--dm-heading);
	border-color: var(--dm-heading);
	color: var(--color-navy);
}

[data-theme="dark"] .text-link {
	color: var(--dm-heading);
}

/* Homepage sections */
[data-theme="dark"] .as-seen-in,
[data-theme="dark"] .how-it-works,
[data-theme="dark"] .package-comparison,
[data-theme="dark"] .instagram-section,
[data-theme="dark"] .why-us-preview {
	background: var(--dm-bg);
}

[data-theme="dark"] .popular-packages,
[data-theme="dark"] .teachers-preview,
[data-theme="dark"] .testimonials-section {
	background: var(--dm-surface);
}

[data-theme="dark"] .stats-section,
[data-theme="dark"] .planning-trip {
	background: #0b1319;
}

[data-theme="dark"] .home-intro-quote p,
[data-theme="dark"] .packages-highlight span,
[data-theme="dark"] .testimonial-card-quote,
[data-theme="dark"] .testimonial-card-author strong {
	color: var(--dm-heading);
}

/* Press logos are JPEGs on white: in dark mode each sits on its own white
   tile, so the brand colours stay true instead of being inverted. */
[data-theme="dark"] .partner-logo-item img {
	mix-blend-mode: normal;
	background: #fff;
	padding: 8px 12px;
	box-sizing: content-box;
}

[data-theme="dark"] .packages-table {
	background: transparent;
	border-top-color: var(--dm-heading);
}

[data-theme="dark"] .packages-table thead th {
	color: var(--dm-heading);
	border-bottom-color: var(--dm-heading);
}

[data-theme="dark"] .packages-table th,
[data-theme="dark"] .packages-table td {
	color: var(--color-text);
}

[data-theme="dark"] .packages-table td:first-child,
[data-theme="dark"] .packages-table th:first-child {
	color: var(--dm-heading);
}

[data-theme="dark"] .packages-table-unified {
	color: var(--dm-heading) !important;
}

[data-theme="dark"] .packages-table tbody tr:hover {
	background: var(--dm-surface);
}

[data-theme="dark"] .testimonial-card {
	background: var(--dm-surface);
}

[data-theme="dark"] .testimonials-slider .testimonial-card {
	background: transparent;
}

[data-theme="dark"] .testimonial-dots button.active {
	background: var(--dm-heading);
}

/* Shared card components used across the homepage (and elsewhere) */
[data-theme="dark"] .service-card,
[data-theme="dark"] .tour-explore-card,
[data-theme="dark"] .season-card,
[data-theme="dark"] .fact-tile,
[data-theme="dark"] .accordion-item {
	background: var(--dm-surface);
	border-color: var(--color-border);
}

[data-theme="dark"] .accordion-item-heading {
	background: var(--dm-surface);
	color: var(--dm-heading);
}

[data-theme="dark"] .partner-nav {
	background: var(--dm-surface);
	border-color: var(--color-border);
	color: var(--color-text);
}

/* Brass labels keep their colour in dark mode (the dark-mode heading rule
   above would otherwise turn these h3s white). */
[data-theme="dark"] .stat-item h3,
[data-theme="dark"] .footer-widget-title,
[data-theme="dark"] .footer-column h3 {
	color: var(--color-gold);
}

/* -----------------------------------------------------------------------
   40. Video bands & click-to-play videos (homepage "A Quick Look at Buenos
       Aires" / "Get to Know Buenos Aires" - see template-parts/content/
       video-band.php and video-player.php)
   ----------------------------------------------------------------------- */
.video-band {
	padding: var(--section-space) 0 0;
	background: var(--color-white);
}

.video-band-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 28px;
}

.video-band-header .section-heading {
	text-align: left;
	margin-bottom: 0;
}

.video-band-header .section-eyebrow {
	margin-bottom: 10px;
}

/* A wide cinematic letterbox over a 16:9 film. The iframe is sized to
   cover the frame AND to be at least 1/0.635 of its height, so only the
   middle ~63% of the picture's height is ever visible - enough to keep
   burned-in subtitles (bottom ~12%) and YouTube's title bar (top) out of
   frame at every width. Container query units make that a pure-CSS rule. */
.video-band-frame {
	position: relative;
	aspect-ratio: 2.8 / 1;
	overflow: hidden;
	container-type: size;
	background: var(--color-navy) center / cover no-repeat;
}

.video-band-frame iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	width: max(100cqw, 280cqh);
	height: max(56.25cqw, 157.5cqh);
	transform: translate(-50%, -50%);
	border: 0;
	pointer-events: none;
	opacity: 0;
	transition: opacity 1.2s ease;
}

.video-band-frame.is-playing iframe {
	opacity: 1;
}

.video-band-caption {
	max-width: 620px;
	margin: 12px 0 0;
	color: var(--color-muted);
}

/* "Watch with sound" (narrated films only): a quiet text button on the
   right of the band's header. */
.video-band-watch {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
	padding: 0;
	background: none;
	border: none;
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-heading);
	cursor: pointer;
}

.video-band-watch-icon {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid currentColor;
	border-radius: 50%;
	font-size: 12px;
	padding-left: 2px;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.video-band-watch:hover .video-band-watch-icon,
.video-band-watch:focus-visible .video-band-watch-icon {
	background: var(--color-heading);
	color: var(--color-white);
}

/* Watching: the full 16:9 picture, zoomed ~18% towards the top-left so
   the watermark burned into the film's bottom-right corner stays out of
   frame; the player takes clicks (pause/play) again. */
.video-band-frame.is-watching {
	aspect-ratio: 16 / 9;
}

.video-band-frame.is-watching iframe {
	top: -3cqw;
	left: -6cqw;
	width: 118cqw;
	height: 66.375cqw;
	transform: none;
	pointer-events: auto;
}

.video-player {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--color-navy);
	overflow: hidden;
}

.video-player iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.video-player-poster {
	position: absolute;
	inset: 0;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.video-player-poster img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1.2s ease;
}

.video-player-poster:hover img,
.video-player-poster:focus-visible img {
	transform: scale(1.03);
}

.video-player-play {
	position: absolute;
	top: 50%;
	left: 50%;
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	transform: translate(-50%, -50%);
	border: 1px solid rgba(255, 255, 255, 0.85);
	border-radius: 50%;
	background: rgba(9, 19, 28, 0.28);
	backdrop-filter: blur(4px);
	color: var(--color-white);
	font-size: 22px;
	transition: background 0.3s ease;
}

.video-player-play i {
	margin-left: 4px;
}

.video-player-poster:hover .video-player-play,
.video-player-poster:focus-visible .video-player-play {
	background: var(--color-primary);
}

[data-theme="dark"] .video-band {
	background: transparent;
}

/* Older iPads and phones (iOS before 16) have no container query units: size
   the narrated crop with percentages instead (4:3 frame, 130% tall, 16:9). */
@supports not (width: 1cqw) {
	.video-player.video-player--crop iframe {
		width: 173%;
	}
}

/* Touch devices: let the embedded players be tapped and never overflow. */
.video-player iframe,
.video-band-frame iframe {
	max-width: none;
}

.video-player {
	max-width: 100%;
}

@media (max-width: 700px) {
	.video-band-header {
		flex-direction: column;
		align-items: flex-start;
	}

	/* A 2.8:1 strip is only ~130px tall on a phone; a deeper crop of the
	   same film reads better there (the iframe rule above still keeps the
	   subtitles out of frame by zooming in). */
	.video-band-frame:not(.is-watching) {
		aspect-ratio: 4 / 3;
	}

	.video-band-header {
		flex-direction: column;
		align-items: flex-start;
	}
}

.video-band-header .section-eyebrow {
	text-align: left;
}

/* -----------------------------------------------------------------------
   41. Tango Experience booking page (page-tango-experience.php) - an
       Airbnb Experiences-style grid of activity cards, each with its own
       booking options, and one booking dialog (full screen on phones).
   ----------------------------------------------------------------------- */
.experience-trust-strip {
	background: var(--color-light-bg);
	border-bottom: 1px solid var(--color-border);
}

.experience-trust-strip ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 40px;
	margin: 0;
	padding: 16px 0;
	list-style: none;
	font-size: 14px;
	color: var(--color-heading);
}

.experience-trust-strip i {
	margin-right: 8px;
	color: var(--color-gold);
}

.experiences {
	padding: var(--section-space) 0;
}

.experiences-header {
	text-align: center;
}

.experience-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 32px 28px;
}

.experience-card {
	display: flex;
	flex-direction: column;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.experience-card:hover {
	box-shadow: 0 18px 40px rgba(14, 28, 41, 0.1);
	transform: translateY(-3px);
}

.experience-card-media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--color-navy);
}

.experience-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.8s ease;
}

.experience-card:hover .experience-card-media img {
	transform: scale(1.04);
}

.experience-card-duration {
	position: absolute;
	left: 14px;
	top: 14px;
	padding: 6px 12px;
	background: rgba(255, 255, 255, 0.94);
	color: var(--color-heading);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.experience-card-duration i {
	margin-right: 6px;
	color: var(--color-primary);
}

.experience-card-body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 22px 22px 20px;
}

.experience-card-title {
	margin: 0 0 8px;
	font-size: 26px;
	line-height: 1.2;
}

.experience-card-title a {
	color: inherit;
}

.experience-card-title a:hover {
	color: var(--color-primary);
}

.experience-card-summary {
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--color-text);
}

.experience-card-highlights {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	font-size: 13.5px;
	color: var(--color-muted);
}

.experience-card-highlights li {
	padding: 2px 0;
}

.experience-card-highlights i {
	width: 18px;
	color: var(--color-gold);
	font-size: 11px;
}

.experience-card-price {
	margin: auto 0 14px;
	padding-top: 14px;
	border-top: 1px solid var(--color-border);
	font-size: 14px;
	color: var(--color-muted);
}

.experience-card-price strong {
	font-family: var(--font-heading);
	font-size: 26px;
	font-weight: 500;
	color: var(--color-heading);
}

.experience-card-options {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.experience-option {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto 12px;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: 1px solid var(--color-border);
	color: var(--color-heading);
	font-size: 14px;
	font-weight: 500;
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.experience-option-price {
	font-size: 13px;
	font-weight: 400;
	color: var(--color-muted);
	white-space: nowrap;
}

.experience-option i {
	font-size: 11px;
	color: var(--color-primary);
}

.experience-option:hover,
.experience-option:focus-visible {
	border-color: var(--color-primary);
	background: var(--color-primary);
	color: var(--color-white);
}

.experience-option:hover .experience-option-price,
.experience-option:hover i,
.experience-option:focus-visible .experience-option-price,
.experience-option:focus-visible i {
	color: var(--color-white);
}

.experience-steps {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

.experience-steps-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.experience-steps-list li {
	text-align: center;
}

.experience-step-number {
	display: inline-grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin-bottom: 14px;
	border: 1px solid var(--color-gold);
	border-radius: 50%;
	font-family: var(--font-heading);
	font-size: 22px;
	color: var(--color-gold);
}

.experience-steps-list h3 {
	margin: 0 0 8px;
	font-size: 24px;
}

.experience-steps-list p {
	max-width: 32ch;
	margin: 0 auto;
	color: var(--color-text);
	font-size: 15px;
}

.experience-page-content {
	padding-top: var(--section-space);
	padding-bottom: var(--section-space);
}

/* Booking dialog */
.experience-dialog {
	width: min(640px, 94vw);
	max-width: none;
	max-height: min(92vh, 900px);
	padding: 0;
	border: 0;
	background: var(--color-white);
	color: var(--color-text);
	box-shadow: 0 30px 80px rgba(9, 19, 28, 0.35);
}

.experience-dialog::backdrop {
	background: rgba(9, 19, 28, 0.6);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

html.experience-dialog-open body {
	overflow: hidden;
}

.experience-form {
	display: flex;
	flex-direction: column;
	max-height: inherit;
}

.experience-dialog-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 24px;
	border-bottom: 1px solid var(--color-border);
}

.experience-dialog-header h2 {
	margin: 0;
	font-size: 28px;
}

.experience-dialog-close {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	color: var(--color-heading);
	font-size: 18px;
}

.experience-dialog-body {
	flex: 1;
	overflow-y: auto;
	padding: 20px 24px 8px;
}

.experience-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}

.experience-field > label,
.experience-field > legend {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-heading);
}

.experience-field > legend {
	margin-bottom: 6px;
}

.experience-optional {
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--color-muted);
}

.experience-field input,
.experience-field select,
.experience-field textarea {
	width: 100%;
	padding: 11px 12px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
	color: var(--color-heading);
	font: inherit;
	font-size: 15px;
}

.experience-field input:focus,
.experience-field select:focus,
.experience-field textarea:focus {
	outline: 2px solid var(--color-primary);
	outline-offset: -1px;
}

.experience-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 16px;
}

.experience-option-list {
	display: grid;
	gap: 8px;
}

.experience-option-choice {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border: 1px solid var(--color-border);
	font-size: 15px;
	color: var(--color-heading);
	cursor: pointer;
}

.experience-field .experience-option-choice input {
	width: 18px;
	height: 18px;
	margin: 0;
	padding: 0;
	accent-color: var(--color-primary);
}

.experience-option-choice:has(input:checked) {
	border-color: var(--color-primary);
	box-shadow: inset 0 0 0 1px var(--color-primary);
	background: rgba(10, 99, 134, 0.05);
}

.experience-option-choice-price {
	font-size: 13.5px;
	color: var(--color-muted);
	white-space: nowrap;
}

.experience-stepper {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) 44px;
	border: 1px solid var(--color-border);
}

.experience-field .experience-stepper input {
	border: 0;
	text-align: center;
	-moz-appearance: textfield;
}

.experience-stepper input::-webkit-inner-spin-button,
.experience-stepper input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.experience-stepper-btn {
	border: 0;
	background: var(--color-light-bg);
	color: var(--color-heading);
	cursor: pointer;
}

.experience-field-error {
	font-size: 13px;
	color: #b3261e;
}

.experience-dialog-footer {
	padding: 16px 24px 18px;
	border-top: 1px solid var(--color-border);
	background: var(--color-white);
}

.experience-total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
	font-size: 14px;
	color: var(--color-muted);
}

.experience-total-amount {
	font-family: var(--font-heading);
	font-size: 30px;
	font-weight: 500;
	color: var(--color-heading);
}

.experience-submit {
	display: flex;
	justify-content: center;
	gap: 10px;
	width: 100%;
}

/* Shared payment reassurance block (template-parts/content/payment-trust.php) */
.payment-trust {
	margin-top: 14px;
	text-align: center;
}

.payment-trust-line {
	margin: 0 0 8px;
	font-size: 13px;
	color: var(--color-muted);
}

.payment-trust-line i {
	margin-right: 6px;
	color: #2e7d32;
}

/* Trust strip above the booking/payment forms (trust-strip.php). */
.trust-strip {
	margin: 0 0 40px;
	padding: 26px 30px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-gold);
}

.trust-strip-items {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.trust-strip-items li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.trust-strip-items i {
	flex-shrink: 0;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--color-gold-soft);
	color: var(--color-gold);
	font-size: 17px;
}

.trust-strip-items span {
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--color-muted);
}

.trust-strip-items strong {
	display: block;
	margin-bottom: 2px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--color-heading);
}

.trust-strip-cards {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px 22px;
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--color-border);
}

.trust-strip-cards-label {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-muted);
}

.trust-strip-cards ul {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.trust-strip-cards li {
	font-size: 34px;
	line-height: 1;
}

.trust-strip-cards .fa-cc-visa { color: #1a1f71; }
.trust-strip-cards .fa-cc-mastercard { color: #eb001b; }
.trust-strip-cards .fa-cc-amex { color: #2e77bc; }
.trust-strip-cards .fa-cc-discover { color: #e55c20; }
.trust-strip-cards .fa-cc-paypal { color: #003087; }
.trust-strip-cards .fa-cc-apple-pay { color: #000; }

.trust-strip-cards img {
	height: 46px;
	width: auto;
}

@media (max-width: 1024px) {
	.trust-strip-items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.trust-strip {
		padding: 22px 18px;
	}

	.trust-strip-items {
		grid-template-columns: minmax(0, 1fr);
	}
}

[data-theme="dark"] .trust-strip {
	background: var(--dm-surface);
}

[data-theme="dark"] .trust-strip-items strong {
	color: var(--dm-heading);
}

[data-theme="dark"] .trust-strip-cards li {
	background: #fff;
	border-radius: 4px;
	padding: 0 3px;
}

.payment-trust-methods {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 30px;
	color: #5b6770;
}

/* "Payments processed securely by [Stripe] [PayPal]" - the processors'
   own logos, in colour, as a recognisable trust signal. */
.payment-trust-processors {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px 16px;
	margin: 4px 0 12px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-muted);
}

.payment-trust-processors span {
	flex-basis: 100%;
}

.payment-trust-logo {
	width: auto;
	height: 22px;
}

.payment-trust-logo--stripe {
	height: 26px;
}

/* Dark mode: the logos sit on a small light tile so their brand colours
   keep their contrast. */
[data-theme="dark"] .payment-trust-logo {
	box-sizing: content-box;
	padding: 4px 8px;
	background: #fff;
}

.payment-trust-badges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 24px;
	margin-top: 18px;
}

.payment-trust-badges img {
	width: auto;
	height: 80px;
}

[data-theme="dark"] .experience-card,
[data-theme="dark"] .experience-dialog,
[data-theme="dark"] .experience-dialog-footer,
[data-theme="dark"] .experience-field input,
[data-theme="dark"] .experience-field select,
[data-theme="dark"] .experience-field textarea {
	background: var(--dm-surface);
	color: var(--dm-heading);
}

[data-theme="dark"] .experience-trust-strip,
[data-theme="dark"] .experience-steps,
[data-theme="dark"] .experience-stepper-btn {
	background: var(--dm-bg);
	color: var(--dm-heading);
}

@media (max-width: 1024px) {
	.experience-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.experience-grid,
	.experience-steps-list,
	.experience-field-row {
		grid-template-columns: minmax(0, 1fr);
	}

	.experience-trust-strip ul {
		justify-content: flex-start;
		gap: 8px 20px;
		font-size: 13px;
	}

	/* Full-screen sheet on phones. */
	.experience-dialog {
		width: 100vw;
		max-width: 100vw;
		height: 100dvh;
		max-height: 100dvh;
		margin: 0;
	}

	.experience-form {
		height: 100%;
	}
}

/* -----------------------------------------------------------------------
   42. Homepage "Book Your Tango Experience" banner (front-page.php)
   ----------------------------------------------------------------------- */
.experience-banner {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
	border-bottom: 1px solid var(--color-border);
}

.experience-banner-inner {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(32px, 5vw, 72px);
	align-items: center;
}

.experience-banner-media {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.experience-banner-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.experience-banner-badge {
	position: absolute;
	left: 16px;
	bottom: 16px;
	padding: 8px 14px;
	background: var(--color-cta);
	color: var(--color-white);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.experience-banner-badge i {
	margin-right: 6px;
}

.experience-banner-content .section-eyebrow {
	text-align: left;
}

.experience-banner-title {
	margin: 0 0 16px;
	font-size: clamp(34px, 3.6vw, 52px);
	line-height: 1.08;
}

.experience-banner-title span {
	display: block;
	color: var(--color-primary);
	font-style: italic;
}

.experience-banner-text {
	max-width: 56ch;
	margin: 0 0 22px;
	color: var(--color-text);
	font-size: 16.5px;
}

.experience-banner-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 28px;
	margin: 0 0 26px;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--color-border);
}

.experience-banner-list a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 11px 0;
	border-bottom: 1px solid var(--color-border);
	color: var(--color-heading);
	font-size: 15px;
	transition: color 0.2s ease, padding-left 0.3s ease;
}

.experience-banner-list em {
	flex-shrink: 0;
	font-style: normal;
	font-size: 13px;
	color: var(--color-muted);
}

.experience-banner-list a:hover {
	padding-left: 6px;
	color: var(--color-primary);
}

.experience-banner-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 24px;
}

.experience-banner-actions .btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.experience-banner-price {
	margin: 0;
	color: var(--color-muted);
}

.experience-banner-price strong {
	font-family: var(--font-heading);
	font-size: 28px;
	font-weight: 500;
	color: var(--color-heading);
}

[data-theme="dark"] .experience-banner {
	background: var(--dm-surface);
}

@media (max-width: 900px) {
	.experience-banner-inner,
	.experience-banner-list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -----------------------------------------------------------------------
   43. Make a Payment (template-parts/content/make-payment.php)
   ----------------------------------------------------------------------- */
.make-payment-page .section-eyebrow {
	text-align: left;
}

.make-payment-heading {
	margin: 0 0 14px;
	font-size: clamp(30px, 3vw, 42px);
}

.make-payment-steps {
	margin: 0 0 28px;
	padding-left: 20px;
	color: var(--color-text);
	line-height: 1.8;
}

.make-payment-zelle {
	margin: 16px 0 0;
	padding: 12px 14px;
	background: var(--color-light-bg);
	font-size: 14px;
	color: var(--color-text);
}

.make-payment-zelle i {
	margin-right: 8px;
	color: var(--color-primary);
}

/* -----------------------------------------------------------------------
   44. FAQ page (page-faqs.php)
   ----------------------------------------------------------------------- */
.faq-page {
	padding-top: var(--section-space);
	padding-bottom: var(--section-space);
}

.faq-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 32px;
	margin-bottom: 32px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--color-border);
}

.faq-search {
	position: relative;
	flex: 1 1 360px;
	max-width: 520px;
}

.faq-search i {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--color-muted);
}

.faq-search input {
	width: 100%;
	padding: 14px 16px 14px 44px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
	font: inherit;
	font-size: 15px;
}

.faq-search input:focus {
	outline: 2px solid var(--color-primary);
	outline-offset: -1px;
}

.faq-tabs {
	display: flex;
	gap: 8px;
}

.faq-tab {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 18px;
	border: 1px solid var(--color-border);
	color: var(--color-heading);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.faq-tab-count {
	display: inline-grid;
	place-items: center;
	min-width: 24px;
	height: 24px;
	padding: 0 6px;
	background: var(--color-light-bg);
	font-size: 12px;
}

.faq-tab.is-active,
.faq-tab:hover {
	border-color: var(--color-cta);
	background: var(--color-cta);
	color: var(--color-white);
}

.faq-tab.is-active .faq-tab-count,
.faq-tab:hover .faq-tab-count {
	background: rgba(255, 255, 255, 0.2);
}

.faq-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: clamp(32px, 5vw, 64px);
	align-items: start;
}

.faq-section + .faq-section {
	margin-top: 48px;
}

.faq-section-title {
	margin: 0 0 16px;
	font-size: clamp(28px, 2.6vw, 36px);
}

.faq-list {
	border-top: 1px solid var(--color-border);
}

.faq-item {
	border-bottom: 1px solid var(--color-border);
}

.faq-question {
	position: relative;
	padding: 20px 48px 20px 0;
	font-family: var(--font-heading);
	font-size: 21px;
	line-height: 1.35;
	color: var(--color-heading);
	list-style: none;
	cursor: pointer;
}

.faq-question::-webkit-details-marker {
	display: none;
}

.faq-question::after {
	content: "+";
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--font-body);
	font-size: 26px;
	font-weight: 300;
	color: var(--color-primary);
	transition: transform 0.3s ease;
}

.faq-item[open] .faq-question::after {
	content: "−";
}

.faq-question:hover {
	color: var(--color-primary);
}

.faq-answer {
	padding: 0 48px 22px 0;
	color: var(--color-text);
	font-size: 15.5px;
	line-height: 1.75;
}

.faq-answer p {
	margin: 0 0 12px;
}

.faq-answer ul {
	margin: 0 0 12px;
	padding-left: 20px;
}

.faq-answer li {
	margin-bottom: 6px;
}

.faq-no-results {
	padding: 24px;
	background: var(--color-light-bg);
	text-align: center;
}

.faq-aside {
	position: sticky;
	top: 110px;
}

.faq-contact-card {
	padding: 28px;
	background: var(--color-navy);
	color: rgba(255, 255, 255, 0.85);
}

.faq-contact-card .section-eyebrow {
	text-align: left;
}

.faq-contact-card h2 {
	margin: 0 0 10px;
	font-size: 28px;
	color: var(--color-white);
}

.faq-contact-card ul {
	margin: 16px 0 22px;
	padding: 0;
	list-style: none;
}

.faq-contact-card li {
	padding: 4px 0;
}

.faq-contact-card i {
	width: 22px;
	color: var(--color-gold);
}

.faq-contact-card a:not(.btn) {
	color: var(--color-white);
}

[data-theme="dark"] .faq-search input {
	background: var(--dm-surface);
	color: var(--dm-heading);
}

@media (max-width: 900px) {
	.faq-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.faq-aside {
		position: static;
	}
}

@media (max-width: 600px) {
	.faq-tabs {
		width: 100%;
	}

	.faq-tab {
		flex: 1;
		justify-content: center;
		padding: 12px 10px;
		font-size: 13px;
	}

	.faq-question {
		font-size: 19px;
	}

	.faq-answer {
		padding-right: 0;
	}
}

/* -----------------------------------------------------------------------
   45. Currency converter (page-currency.php)
   ----------------------------------------------------------------------- */
.currency-page {
	padding-top: var(--section-space);
	padding-bottom: var(--section-space);
}

.currency-converter {
	max-width: 980px;
	margin: 0 auto var(--section-space);
	padding: clamp(24px, 4vw, 44px);
	background: var(--color-white);
	border: 1px solid var(--color-border);
	box-shadow: 0 20px 50px rgba(14, 28, 41, 0.06);
}

.currency-converter-intro {
	margin-bottom: 26px;
}

.currency-converter-intro p {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--color-text);
}

.currency-converter-intro .currency-converter-date {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
	padding: 7px 14px;
	background: var(--color-gold-soft);
	font-size: 13px;
	letter-spacing: 0.04em;
	color: var(--color-heading);
}

.currency-converter-date i {
	color: var(--color-gold);
}

.currency-convert {
	margin-top: 22px;
	min-width: 180px;
}

.currency-result:focus {
	outline: none;
}

.currency-result.is-flash .currency-result-to {
	animation: currency-flash 0.9s ease;
}

@keyframes currency-flash {
	from { color: var(--color-primary); }
	to { color: var(--color-heading); }
}

.currency-converter-fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 48px minmax(0, 1.4fr);
	gap: 16px;
	align-items: end;
}

.currency-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.currency-field span {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-heading);
}

.currency-field input,
.currency-field select {
	width: 100%;
	height: 52px;
	padding: 0 14px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
	color: var(--color-heading);
	font: inherit;
	font-size: 16px;
}

.currency-swap {
	height: 52px;
	border: 1px solid var(--color-border);
	background: var(--color-light-bg);
	color: var(--color-primary);
	font-size: 18px;
	cursor: pointer;
}

.currency-swap:hover {
	background: var(--color-primary);
	color: var(--color-white);
}

.currency-result {
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid var(--color-border);
}

.currency-result-from {
	margin: 0;
	color: var(--color-muted);
	font-size: 16px;
}

.currency-result-to {
	margin: 4px 0 6px;
	font-family: var(--font-heading);
	font-size: clamp(36px, 5vw, 56px);
	line-height: 1.1;
	color: var(--color-heading);
}

.currency-result-rate {
	margin: 0;
	font-size: 14px;
	color: var(--color-muted);
}

.currency-updated {
	margin: 18px 0 0;
	font-size: 13px;
	color: var(--color-muted);
}

.currency-columns {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	gap: clamp(28px, 4vw, 56px);
	align-items: start;
}

.currency-columns h2 {
	margin: 0 0 18px;
	font-size: clamp(26px, 2.4vw, 32px);
}

.currency-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.currency-table th,
.currency-table td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--color-border);
	text-align: left;
}

.currency-table th {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-muted);
}

.currency-name {
	margin-left: 6px;
	color: var(--color-muted);
	font-size: 13px;
}

.currency-tips {
	padding: 28px;
	background: var(--color-light-bg);
}

.currency-tips ul {
	margin: 0;
	padding-left: 18px;
	color: var(--color-text);
	line-height: 1.7;
}

.currency-tips li {
	margin-bottom: 10px;
}

[data-theme="dark"] .currency-converter,
[data-theme="dark"] .currency-field input,
[data-theme="dark"] .currency-field select {
	background: var(--dm-surface);
	color: var(--dm-heading);
}

@media (max-width: 800px) {
	.currency-converter-fields {
		grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr);
	}

	.currency-field--amount {
		grid-column: 1 / -1;
	}

	.currency-columns {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -----------------------------------------------------------------------
   46. Our Team (page-our-team.php, About page) - Tully-style portraits
   ----------------------------------------------------------------------- */
.team-page {
	padding: var(--section-space) 0;
}

.team-page-intro {
	max-width: 720px;
	margin: 0 auto 36px;
	text-align: center;
}

.team-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.team-card {
	position: relative;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	background: var(--color-navy);
}

/* "Read bio": opens over the portrait (client, 2026-10-22). */
.team-card-bio {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	color: var(--color-white);
}

.team-card-bio summary {
	padding: 6px 10px;
	cursor: pointer;
	list-style: none;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	background: rgba(9, 19, 28, 0.45);
	border: 1px solid rgba(255, 255, 255, 0.7);
}

.team-card-bio summary::-webkit-details-marker {
	display: none;
}

.team-card-bio[open] {
	inset: 0;
	padding: 52px 20px 20px;
	overflow-y: auto;
	background: rgba(9, 19, 28, 0.94);
}

.team-card-bio[open] summary {
	position: absolute;
	top: 12px;
	right: 12px;
}

.team-card-bio p {
	margin: 0 0 12px;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.9);
}

.team-card-bio strong {
	display: block;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.team-card-bio summary:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 2px;
}

.team-group-heading {
	margin: 40px 0 18px;
	padding-top: 18px;
	border-top: 1px solid var(--color-gold);
	font-size: 28px;
	text-align: left;
}

.team-group-heading:first-of-type {
	margin-top: 8px;
}

.team-card-photo,
.team-card-photo img {
	width: 100%;
	height: 100%;
}

.team-card-photo img {
	object-fit: cover;
	object-position: center 25%;
	filter: grayscale(1) contrast(1.05);
	transition: filter 0.6s ease, transform 0.8s ease;
}

.team-card:hover .team-card-photo img {
	filter: none;
	transform: scale(1.03);
}

.team-card-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 72px 18px 22px;
	background: linear-gradient(180deg, rgba(9, 19, 28, 0) 0%, rgba(9, 19, 28, 0.85) 100%);
	text-align: center;
	color: var(--color-white);
}

.team-card-name {
	margin: 0 0 6px;
	font-size: 27px;
	line-height: 1.15;
	color: var(--color-white);
}

.team-card-role {
	margin: 0;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.85);
}

.team-page-cta {
	margin-top: 40px;
	text-align: center;
}

.team-page-cta p {
	margin: 0 0 12px;
	color: var(--color-muted);
}

@media (max-width: 900px) {
	.team-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 480px) {
	.team-card-name {
		font-size: 21px;
	}

	.team-card-caption {
		padding: 56px 10px 14px;
	}

	.team-card-role {
		font-size: 10.5px;
	}
}

/* Apartments Rental: note under the property photos. */
.rental-photo-note {
	margin: 18px 0 0;
	text-align: center;
	font-size: 13.5px;
	color: var(--color-muted);
}

/* The global reset removes list markers; these two lists need them. */
.faq-answer ul,
.currency-tips ul {
	list-style: disc;
}

.faq-answer li::marker,
.currency-tips li::marker {
	color: var(--color-gold);
}

/* Corporate Tango: the trust badges sit above the reused homepage stats band. */
article.page-content + .stats-section {
	margin-top: var(--section-space);
}

/* Page text directly under a page hero gets the section rhythm above it
   (it sat flush against the photo). */
.page-hero + article.page-content {
	padding-top: var(--section-space);
}

/* -----------------------------------------------------------------------
   47. Hotel showcase - "Your Stay, Your Style" (page-hotels.php)
   ----------------------------------------------------------------------- */
.hotels-intro,
.hotel-styles,
.hotel-partners,
.hotel-matching,
.hotel-preferences,
.hotel-testimonials {
	padding: var(--section-space) 0;
}

.hotel-styles,
.hotel-matching,
.hotel-testimonials {
	background: var(--color-light-bg);
}

.hotels-section-header {
	max-width: 720px;
	margin: 0 auto;
}

/* CC BY photos carry their credit on the image itself. */
.hotel-style-photo,
.hotel-partner-photo,
.hotels-intro-photo,
.hotel-matching-photo {
	position: relative;
	margin: 0;
	overflow: hidden;
}

.hotel-style-photo img,
.hotel-partner-photo img,
.hotels-intro-photo img,
.hotel-matching-photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.page-hero-credit {
	z-index: 2;
}

.hotel-photo-credit {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 3px 8px;
	background: rgba(9, 19, 28, 0.55);
	color: rgba(255, 255, 255, 0.85);
	font-size: 10.5px;
	letter-spacing: 0.02em;
}

/* Intro */
.hotels-intro-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(32px, 5vw, 72px);
	align-items: center;
}

.hotels-intro-text .section-eyebrow,
.hotels-intro-text .section-heading {
	text-align: left;
}

.hotels-intro-text .section-heading {
	margin-bottom: 20px;
}

.hotels-intro-content p {
	margin: 0 0 14px;
}

.hotels-intro-facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 28px 0 0;
	padding: 22px 0 0;
	border-top: 1px solid var(--color-gold);
	list-style: none;
}

.hotels-intro-facts strong {
	display: block;
	font-family: var(--font-heading);
	font-size: clamp(24px, 2.4vw, 32px);
	font-weight: 400;
	line-height: 1.1;
	color: var(--color-heading);
}

.hotels-intro-facts span {
	font-size: 13px;
	color: var(--color-muted);
}

.hotels-intro-photo {
	aspect-ratio: 4 / 5;
}

/* Hotel styles */
/* Seven hotel styles: four, then three, centred (no orphan card). */
.hotel-style-grid.hotel-style-grid--styles {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.hotel-style-grid--styles > .hotel-style-card {
	flex: 0 1 calc((100% - 3 * 24px) / 4);
}

.hotel-style-examples {
	margin: -6px 0 14px;
	font-size: 13.5px;
	font-style: italic;
	line-height: 1.55;
	color: var(--color-muted);
}

@media (max-width: 1100px) {
	.hotel-style-grid--styles > .hotel-style-card {
		flex-basis: calc((100% - 24px) / 2);
	}
}

@media (max-width: 800px) {
	.hotel-style-grid--styles > .hotel-style-card {
		flex-basis: 100%;
	}
}

.hotel-style-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.hotel-style-card {
	display: flex;
	flex-direction: column;
	background: var(--color-white);
}

.hotel-style-photo {
	aspect-ratio: 3 / 2;
}

.hotel-style-photo img {
	transition: transform 0.8s ease;
}

.hotel-style-card:hover .hotel-style-photo img {
	transform: scale(1.04);
}

.hotel-style-body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 24px 26px 26px;
}

.hotel-style-badge {
	margin: 0 0 8px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.hotel-stars {
	display: inline-flex;
	gap: 3px;
	color: var(--color-gold);
	font-size: 12px;
	letter-spacing: 0;
}

.hotel-style-title {
	margin: 0 0 10px;
	font-size: 28px;
}

.hotel-style-text {
	margin: 0 0 18px;
	font-size: 15px;
}

.hotel-style-best {
	margin: auto 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--color-border);
	font-size: 14px;
	color: var(--color-heading);
}

.hotel-style-best span {
	margin-right: 6px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-muted);
}

/* Partner hotels: alternating photo/text rows */
.hotel-partner-list {
	display: grid;
	gap: clamp(32px, 4vw, 56px);
}

.hotel-partner {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: clamp(28px, 4.5vw, 64px);
	align-items: center;
}

.hotel-partner:nth-child(even) .hotel-partner-photo {
	order: 2;
}

.hotel-partner-photo {
	aspect-ratio: 3 / 2;
}

.hotel-partner-photo figcaption {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 6px 12px;
	background: rgba(9, 19, 28, 0.55);
	color: var(--color-white);
	font-size: 12px;
}

.hotel-partner-body .hotel-stars {
	margin: 0 0 10px;
	font-size: 14px;
}

.hotel-partner-name {
	margin: 0 0 8px;
	font-size: clamp(32px, 3.2vw, 42px);
}

.hotel-partner-area {
	margin: 0 0 16px;
	font-size: 14px;
	color: var(--color-muted);
}

.hotel-partner-area i {
	margin-right: 4px;
	color: var(--color-gold);
}

.hotel-partner-text {
	margin: 0 0 18px;
}

.hotel-partner-features {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px 20px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14.5px;
}

.hotel-partner-features i {
	margin-right: 6px;
	font-size: 11px;
	color: var(--color-gold);
}

/* Partner hotels as a one-at-a-time showcase (page-hotels.php): a
   snap-scrolling track, with "01 / 03", a progress line and the arrows set
   under the photograph (tropicalsunvacations.com). */
.hotel-showcase {
	--showcase-gap: clamp(28px, 4.5vw, 64px);
	margin-top: 8px;
}

.hotel-showcase-track {
	display: flex;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.hotel-showcase-track::-webkit-scrollbar {
	display: none;
}

.hotel-showcase-track:focus-visible {
	outline: 1px solid var(--color-gold);
	outline-offset: 6px;
}

.hotel-showcase .hotel-partner {
	flex: 0 0 100%;
	gap: var(--showcase-gap);
	scroll-snap-align: start;
}

.hotel-showcase .hotel-partner:nth-child(even) .hotel-partner-photo {
	order: 0;
}

.hotel-showcase-footer {
	width: calc((100% - var(--showcase-gap)) * 1.15 / 2.15);
	margin-top: 28px;
}

.carousel-count {
	flex: none;
	margin: 0;
	font-family: var(--font-heading);
	font-size: 15px;
	letter-spacing: 0.06em;
	color: var(--color-muted);
}

.carousel-count span {
	font-size: 22px;
	color: var(--color-heading);
}

.carousel-count i {
	margin: 0 2px;
	font-style: normal;
	color: var(--color-gold);
}

[data-theme="dark"] .carousel-count span {
	color: var(--dm-heading);
}

/* Stacked (photo above text), the controls would fall below the whole
   description - so they are pinned straight under the 3:2 photo instead,
   and the photo leaves room for them. */
@media (max-width: 800px) {
	.hotel-showcase {
		position: relative;
		container-type: inline-size;
	}

	.hotel-showcase .hotel-partner-photo {
		margin-bottom: 64px;
	}

	.hotel-showcase-footer {
		position: absolute;
		top: calc(100cqw * 2 / 3 + 16px);
		left: 0;
		right: 0;
		width: auto;
		margin-top: 0;
	}
}

/* Matching process */
.hotel-matching-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(32px, 5vw, 72px);
	align-items: center;
}

.hotel-matching-photo {
	aspect-ratio: 4 / 5;
}

.hotel-matching-body .section-eyebrow,
.hotel-matching-body .section-heading {
	text-align: left;
}

.hotel-matching-body .section-heading {
	margin-bottom: 28px;
}

.hotel-matching-steps {
	display: grid;
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hotel-matching-steps li {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

.hotel-matching-steps .experience-step-number {
	margin: 0;
}

.hotel-matching-steps h3 {
	margin: 4px 0;
	font-size: 24px;
}

.hotel-matching-steps p {
	margin: 0;
	font-size: 15px;
}

/* Guest preferences */
.hotel-preference-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--color-border);
	border-left: 1px solid var(--color-border);
}

.hotel-preference-grid li {
	padding: 28px 26px;
	border-right: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}

.hotel-preference-grid i {
	font-size: 22px;
	color: var(--color-primary);
}

.hotel-preference-grid h3 {
	margin: 14px 0 6px;
	font-size: 23px;
}

.hotel-preference-grid p {
	margin: 0;
	font-size: 14.5px;
}

.hotel-preferences-note {
	margin: 24px 0 0;
	text-align: center;
	color: var(--color-muted);
}

/* Testimonials */
.hotel-quote-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.hotel-quote {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 30px 28px 26px;
	background: var(--color-white);
	border-top: 2px solid var(--color-gold);
}

.hotel-quote-hotel {
	margin: 0 0 14px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.hotel-quote blockquote {
	margin: 0 0 20px;
	padding: 0;
	border: 0;
}

.hotel-quote blockquote p {
	margin: 0;
	font-family: var(--font-heading);
	font-style: italic;
	font-size: 21px;
	line-height: 1.45;
	color: var(--color-heading);
}

.hotel-quote figcaption {
	margin-top: auto;
	font-size: 14px;
}

.hotel-quote figcaption strong {
	display: block;
	font-weight: 500;
	color: var(--color-heading);
}

.hotel-quote figcaption span {
	color: var(--color-muted);
}

.hotel-testimonials-more {
	margin: 32px 0 0;
	text-align: center;
}

.hotels-cta-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

[data-theme="dark"] .hotel-styles,
[data-theme="dark"] .hotel-matching,
[data-theme="dark"] .hotel-testimonials {
	background: var(--dm-bg);
}

[data-theme="dark"] .hotel-style-card,
[data-theme="dark"] .hotel-quote {
	background: var(--dm-surface);
}

@media (max-width: 1024px) {
	.hotel-style-grid,
	.hotel-quote-grid,
	.hotel-preference-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 800px) {
	.hotels-intro-grid,
	.hotel-partner,
	.hotel-matching-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.hotel-partner:nth-child(even) .hotel-partner-photo {
		order: 0;
	}

	.hotels-intro-photo,
	.hotel-matching-photo {
		aspect-ratio: 3 / 2;
	}
}

@media (max-width: 600px) {
	.hotel-style-grid,
	.hotel-quote-grid,
	.hotel-preference-grid,
	.hotel-partner-features {
		grid-template-columns: minmax(0, 1fr);
	}

	.hotels-intro-facts {
		gap: 10px;
	}

	.hotels-intro-facts span {
		font-size: 12px;
	}
}

/* -----------------------------------------------------------------------
   48. Cookie consent (inc/cookie-consent.php) - bottom banner in the
   Ritz-Carlton Yacht Collection pattern, preference center dialog,
   placeholders for third-party embeds, footer legal links, cookie tables.
   ----------------------------------------------------------------------- */
.consent-banner {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background: var(--color-white);
	border-top: 1px solid var(--color-gold);
	box-shadow: 0 -12px 40px rgba(9, 19, 28, 0.12);
	color: var(--color-text);
}

.consent-banner[hidden] {
	display: none;
}

.consent-banner-inner {
	display: flex;
	align-items: center;
	gap: 20px 40px;
	max-width: 1320px;
	margin: 0 auto;
	padding: 22px 40px;
}

.consent-banner-text {
	flex: 1;
	font-size: 14px;
	line-height: 1.6;
}

.consent-banner-text p {
	margin: 0;
}

.consent-banner-title {
	margin-bottom: 4px !important;
	font-family: var(--font-heading);
	font-size: 22px;
	color: var(--color-heading);
}

.consent-banner-text a,
.consent-dialog-links a {
	color: var(--color-primary);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.consent-gpc-note {
	margin-top: 6px !important;
	font-size: 13px;
	color: var(--color-muted);
}

.consent-banner-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	flex-shrink: 0;
}

.consent-btn {
	padding: 13px 22px;
	font-size: 11px;
	white-space: nowrap;
}

/* Keep the banner from covering the end of the page. */
.consent-banner-open body {
	padding-bottom: 120px;
}

/* Preference center */
.consent-dialog {
	width: min(680px, calc(100vw - 32px));
	max-width: none;
	max-height: min(86vh, 820px);
	padding: 0;
	border: 0;
	background: var(--color-white);
	color: var(--color-text);
}

.consent-dialog::backdrop {
	background: rgba(9, 19, 28, 0.6);
}

.consent-dialog-form {
	display: flex;
	flex-direction: column;
	max-height: min(86vh, 820px);
}

.consent-dialog-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 22px 28px;
	border-bottom: 1px solid var(--color-border);
}

.consent-dialog-header h2 {
	margin: 0;
	font-size: 28px;
}

.consent-dialog-close {
	width: 40px;
	height: 40px;
	border: 0;
	background: none;
	font-size: 20px;
	color: var(--color-heading);
	cursor: pointer;
}

.consent-dialog-body {
	flex: 1;
	padding: 22px 28px;
	overflow-y: auto;
	font-size: 14.5px;
	line-height: 1.65;
}

.consent-dialog-body > p {
	margin: 0 0 14px;
}

.consent-dialog-subtitle {
	margin: 26px 0 12px;
	font-size: 22px;
}

.consent-categories {
	border-top: 1px solid var(--color-border);
}

.consent-category {
	border-bottom: 1px solid var(--color-border);
}

.consent-category-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.consent-category-toggle {
	display: flex;
	flex: 1;
	align-items: center;
	gap: 14px;
	padding: 16px 0;
	border: 0;
	background: none;
	font: inherit;
	font-weight: 500;
	font-size: 15px;
	color: var(--color-heading);
	text-align: left;
	cursor: pointer;
}

.consent-category-toggle i {
	width: 12px;
	font-size: 11px;
	color: var(--color-gold);
	transition: transform 0.2s ease;
}

.consent-category-toggle[aria-expanded="true"] i {
	transform: rotate(45deg);
}

.consent-always {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.consent-category-body {
	padding: 0 0 18px 26px;
	font-size: 14px;
}

.consent-category-body p {
	margin: 0 0 12px;
}

.consent-ccpa-note {
	padding: 10px 14px;
	background: var(--color-light-bg);
	font-size: 13px;
}

/* Toggle switch */
.consent-switch {
	position: relative;
	display: inline-flex;
	flex-shrink: 0;
	cursor: pointer;
}

.consent-switch input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.consent-switch-track {
	position: relative;
	width: 44px;
	height: 24px;
	border-radius: 12px;
	background: #b9bec2;
	transition: background-color 0.2s ease;
}

.consent-switch-track::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--color-white);
	transition: transform 0.2s ease;
}

.consent-switch input:checked + .consent-switch-track {
	background: var(--color-primary);
}

.consent-switch input:checked + .consent-switch-track::after {
	transform: translateX(20px);
}

.consent-switch input:focus-visible + .consent-switch-track {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

.consent-dialog-footer {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 10px;
	padding: 18px 28px;
	border-top: 1px solid var(--color-border);
	background: var(--color-light-bg);
}

/* Cookie tables (preference center + Cookie Policy page) */
.cookie-table-wrap {
	overflow-x: auto;
	margin: 0 0 8px;
}

.cookie-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	line-height: 1.5;
}

.cookie-table th,
.cookie-table td {
	padding: 9px 10px;
	border-bottom: 1px solid var(--color-border);
	text-align: left;
	vertical-align: top;
}

.cookie-table th {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-muted);
	background: var(--color-light-bg);
}

.cookie-table code {
	font-size: 12px;
	word-break: break-word;
	background: none;
	color: var(--color-heading);
}

.cookie-policy-category {
	margin: 28px 0;
}

.cookie-policy-none {
	font-style: italic;
	color: var(--color-muted);
}

.cookie-settings-button {
	margin: 8px 0 16px;
}

/* Third-party embed placeholders */
.consent-embed {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-light-bg);
	border: 1px solid var(--color-border);
}

.consent-embed--map {
	height: 100%;
	min-height: 380px;
	border: 0;
}

.consent-embed-notice {
	max-width: 400px;
	padding: 28px;
	text-align: center;
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text);
}

.consent-embed-notice p {
	margin: 0 0 16px;
}

.consent-embed-icon {
	display: block;
	margin-bottom: 12px;
	font-size: 30px;
	color: var(--color-gold);
}

.consent-embed-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 16px;
}

.consent-link-button,
.footer-legal-button {
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	color: var(--color-primary);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

/* Notice laid over a video poster / inside the video lightbox. */
.consent-embed-notice--overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	max-width: none;
	background: rgba(9, 19, 28, 0.82);
	color: rgba(255, 255, 255, 0.9);
}

.consent-embed-notice--overlay p {
	max-width: 420px;
}

.consent-embed-notice--overlay .consent-link-button {
	color: var(--color-white);
}

/* Footer legal links */
.footer-legal-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 22px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.footer-legal-links a,
.footer-legal-links .footer-legal-button {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	font-size: 12px;
	letter-spacing: 0.06em;
}

.footer-legal-links a:hover,
.footer-legal-links .footer-legal-button:hover {
	color: var(--color-white);
}

[data-theme="dark"] .consent-banner,
[data-theme="dark"] .consent-dialog {
	background: var(--dm-surface);
	color: var(--color-text);
}

[data-theme="dark"] .consent-dialog-footer,
[data-theme="dark"] .consent-ccpa-note,
[data-theme="dark"] .cookie-table th,
[data-theme="dark"] .consent-embed {
	background: var(--dm-bg);
}

[data-theme="dark"] .consent-banner-title,
[data-theme="dark"] .consent-dialog-header h2,
[data-theme="dark"] .consent-dialog-close,
[data-theme="dark"] .consent-category-toggle,
[data-theme="dark"] .cookie-table code {
	color: var(--dm-heading);
}

/* Tablets and phones: a compact bar, so the page behind it stays
   readable (client: quotes and text "not showing up" on iPad and
   phones - the full-size banner was covering a third of the screen).
   "Manage Preferences" becomes a text link under the two buttons. */
@media (max-width: 1024px) {
	.consent-banner-inner {
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
		padding: 14px 24px;
	}

	.consent-banner-title {
		display: none;
	}

	.consent-banner-text {
		font-size: 12.5px;
		line-height: 1.5;
	}

	.consent-banner-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
	}

	.consent-banner-actions [data-consent-open] {
		grid-column: 1 / -1;
		order: 3;
		padding: 2px;
		border: none;
		background: none;
		color: var(--color-muted);
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.consent-banner-open body {
		padding-bottom: 170px;
	}
}

@media (max-width: 600px) {
	.consent-banner-inner {
		padding: 12px 16px;
	}

	.consent-banner-text {
		font-size: 12px;
	}

	.consent-btn {
		padding: 11px 10px;
	}

	.consent-dialog-header,
	.consent-dialog-body,
	.consent-dialog-footer {
		padding-left: 18px;
		padding-right: 18px;
	}

	.consent-dialog-footer .consent-btn {
		flex: 1;
	}

	.consent-category-body {
		padding-left: 0;
	}

	/* Cookie tables become stacked label/value rows. */
	.cookie-table thead {
		display: none;
	}

	.cookie-table tr {
		display: block;
		padding: 8px 0;
		border-bottom: 1px solid var(--color-border);
	}

	.cookie-table td {
		display: grid;
		grid-template-columns: 76px minmax(0, 1fr);
		gap: 8px;
		padding: 3px 0;
		border: 0;
	}

	.cookie-table td::before {
		content: attr(data-label);
		font-size: 10.5px;
		font-weight: 500;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--color-muted);
	}

	.consent-banner-open body {
		padding-bottom: 190px;
	}
}

/* -----------------------------------------------------------------------
   49. Carousel arrows + progress line (carousel-arrows.php) - the live
   site's forward/backward arrows, used by Planning Your Trip.
   ----------------------------------------------------------------------- */
.planning-trip-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px 28px;
}

.carousel-arrows {
	display: flex;
	gap: 10px;
}

.carousel-arrow {
	display: inline-grid;
	place-items: center;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.45);
	border-radius: 50%;
	background: transparent;
	color: var(--color-white);
	font-size: 15px;
	cursor: pointer;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease;
}

.carousel-arrow:hover:not(:disabled),
.carousel-arrow:focus-visible {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-navy);
}

.carousel-arrow:disabled {
	opacity: 0.3;
	cursor: default;
}

.carousel-arrows--light .carousel-arrow {
	border-color: var(--color-heading);
	color: var(--color-heading);
}

.carousel-arrows--light .carousel-arrow:hover:not(:disabled),
.carousel-arrows--light .carousel-arrow:focus-visible {
	background: var(--color-heading);
	color: var(--color-white);
}

/* The arrows and progress line replace the native scrollbar. */
.planning-trip-scroller {
	padding-bottom: 0;
	scrollbar-width: none;
}

.planning-trip-scroller::-webkit-scrollbar {
	display: none;
}

.planning-trip-scroller:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 6px;
}

.carousel-progress {
	position: relative;
	height: 2px;
	margin-top: 32px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.18);
}

.carousel-progress span {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 30%;
	background: var(--color-gold);
	transition: transform 0.15s linear;
}

/* Auto-scrolling strips ([data-carousel-autoplay], theme.js): the drift
   sets scrollLeft every frame, so snapping and smooth scrolling are off. */
.is-looping {
	scroll-snap-type: none;
	scroll-behavior: auto;
}

/* Progress line and small arrows sit together under an auto-scrolling
   strip (client: "make the arrows very minute and at the bottom"). */
.carousel-footer {
	display: flex;
	align-items: center;
	gap: 24px;
	margin-top: 32px;
}

.carousel-footer .carousel-progress {
	flex: 1;
	margin-top: 0;
}

.carousel-footer--light .carousel-progress {
	background: rgba(14, 28, 41, 0.14);
}

.carousel-arrows.carousel-arrows--small {
	gap: 6px;
}

.carousel-arrows--small .carousel-arrow {
	width: 30px;
	height: 30px;
	font-size: 10px;
	border-color: rgba(255, 255, 255, 0.35);
}

.carousel-arrows--small.carousel-arrows--light .carousel-arrow {
	border-color: rgba(14, 28, 41, 0.3);
}

/* Homepage teachers: a single drifting row, four portraits across on a
   desktop, two and a bit on a tablet, one and a half on a phone. */
.teacher-scroller {
	display: flex;
	gap: 24px;
	margin-top: 56px;
	overflow-x: auto;
	scrollbar-width: none;
}

.teacher-scroller::-webkit-scrollbar {
	display: none;
}

.teacher-scroller:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 6px;
}

.teacher-scroller > .teacher-card {
	flex: 0 0 calc((100% - 3 * 24px) / 4);
}

@media (max-width: 1024px) {
	.teacher-scroller > .teacher-card {
		flex-basis: 38%;
	}
}

@media (max-width: 600px) {
	.teacher-scroller > .teacher-card {
		flex-basis: 66%;
	}
}

[data-theme="dark"] .carousel-footer--light .carousel-progress {
	background: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .carousel-arrows--small.carousel-arrows--light .carousel-arrow {
	border-color: rgba(255, 255, 255, 0.35);
	color: var(--dm-heading);
}

@media (max-width: 600px) {
	.carousel-arrow:not(.carousel-arrows--small *) {
		width: 44px;
		height: 44px;
	}

	.planning-trip-actions {
		width: 100%;
		justify-content: space-between;
	}
}

/* -----------------------------------------------------------------------
   50. Testimonials - every card has a photo (testimonial-card.php), the
   carousel (testimonials-slider.php) has arrows, a counter and a clearly
   visible progress line; the Testimonials page expands full stories.
   ----------------------------------------------------------------------- */
.testimonial-card {
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	align-items: center;
}

.testimonial-card-photo {
	position: relative;
	margin: 0;
}

.testimonial-card-mark {
	display: block;
	height: 54px;
	font-family: var(--font-heading);
	font-size: 110px;
	line-height: 1;
	color: var(--color-gold);
	opacity: 0.7;
}

blockquote.testimonial-card-quote {
	margin: 0 0 30px;
	padding: 0;
	border: 0;
	background: none;
}

blockquote.testimonial-card-quote p {
	margin: 0;
	font: inherit;
	color: inherit;
}

.testimonials-slider .testimonial-card-quote::before,
.testimonials-slider .testimonial-card-quote::after {
	content: none;
}

/* Carousel slide: quote on the left, photo on the right with an offset
   brass frame (the client preferred the photo on the right). */
.testimonial-slide {
	flex: 0 0 100%;
	width: 100%;
	padding: 0 26px 26px 0;
	transition: opacity 0.6s ease;
}

.testimonial-slide[aria-hidden="true"] {
	opacity: 0.25;
}

.testimonials-slider .testimonial-card {
	flex: none;
	grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
	gap: clamp(40px, 7vw, 110px);
}

.testimonials-slider .testimonial-card-photo {
	order: 2;
	aspect-ratio: 4 / 5;
	overflow: visible;
}

.testimonials-slider .testimonial-card-photo img {
	position: relative;
	z-index: 1;
}

.testimonial-card-photo .hotel-photo-credit {
	z-index: 2;
}

.testimonials-slider .testimonial-card-photo::after {
	content: "";
	position: absolute;
	top: 26px;
	left: 26px;
	right: -26px;
	bottom: -26px;
	border: 1px solid var(--color-gold);
}

.testimonials-slider .testimonial-card-quote {
	font-size: clamp(22px, 2.2vw, 30px);
}

.testimonials-grid {
	touch-action: pan-y;
	cursor: grab;
}

.testimonials-grid:active {
	cursor: grabbing;
}

.testimonials-controls {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px 40px;
	margin-top: 44px;
}

.testimonials-nav {
	display: flex;
	align-items: center;
	gap: 16px;
}

.testimonials-nav .carousel-arrow {
	border-color: var(--color-heading);
	color: var(--color-heading);
}

.testimonials-nav .carousel-arrow:hover,
.testimonials-nav .carousel-arrow:focus-visible {
	background: var(--color-heading);
	border-color: var(--color-heading);
	color: var(--color-white);
}

.testimonials-counter {
	min-width: 72px;
	margin: 0;
	font-family: var(--font-heading);
	font-size: 20px;
	color: var(--color-muted);
	text-align: center;
}

.testimonials-counter span {
	font-size: 26px;
	color: var(--color-heading);
}

.testimonials-controls .testimonial-dots {
	flex: 1;
	max-width: 520px;
	gap: 6px;
	margin: 0;
}

.testimonials-controls .testimonial-dots button {
	flex: 1;
	width: auto;
	height: 20px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.testimonials-controls .testimonial-dots button span {
	display: block;
	height: 3px;
	background: rgba(14, 28, 41, 0.18);
	transition: background-color 0.3s ease;
}

.testimonials-controls .testimonial-dots button:hover span {
	background: rgba(14, 28, 41, 0.4);
}

.testimonials-controls .testimonial-dots button.active span {
	background: var(--color-gold);
}

[data-theme="dark"] .testimonials-nav .carousel-arrow {
	border-color: var(--dm-heading);
	color: var(--dm-heading);
}

[data-theme="dark"] .testimonials-controls .testimonial-dots button span {
	background: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .testimonials-counter span {
	color: var(--dm-heading);
}

@media (max-width: 767px) {
	.testimonial-card,
	.testimonials-slider .testimonial-card {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
	}

	.testimonial-card-photo,
	.testimonials-slider .testimonial-card-photo {
		order: -1;
		aspect-ratio: 4 / 3;
	}

	.testimonial-slide {
		padding: 0 16px 16px 0;
	}

	.testimonials-slider .testimonial-card-photo::after {
		top: 16px;
		left: 16px;
		right: -16px;
		bottom: -16px;
	}

	.testimonials-controls .testimonial-dots {
		flex-basis: 100%;
		max-width: none;
	}
}

/* Text-only testimonials (the default - Customizer > Testimonials). After
   anthologytravel.com: no photograph, the guest's words set large in the
   upright serif, centred, with a brass hairline over the name; the arrows
   sit either side of the progress line (tropicalsunvacations.com's
   "<- read the reviews ->" bar). */
.testimonials-carousel--text .testimonials-grid {
	align-items: center;
}

.testimonials-carousel--text .testimonial-slide {
	padding: 0;
}

.testimonials-carousel--text .testimonial-card,
.testimonial-card--text {
	display: block;
	max-width: 940px;
	margin: 0 auto;
	padding: 0 clamp(0px, 3vw, 40px);
	background: transparent;
	text-align: center;
}

.testimonial-card--text .testimonial-card-body {
	max-width: none;
}

.testimonial-card--text .testimonial-card-mark {
	height: 46px;
	font-size: 96px;
	opacity: 0.55;
}

.testimonials-slider .testimonial-card--text .testimonial-card-quote {
	margin-bottom: 34px;
	font-style: normal;
	font-size: clamp(23px, 2.55vw, 35px);
	line-height: 1.42;
	letter-spacing: -0.005em;
}

.testimonial-card--text .testimonial-card-author::before {
	content: "";
	display: block;
	width: 44px;
	height: 1px;
	margin: 0 auto 20px;
	background: var(--color-gold);
}

.testimonial-card--text .testimonial-card-author span {
	display: block;
	margin-top: 4px;
}

.testimonials-carousel--text .testimonials-controls {
	justify-content: center;
	flex-wrap: nowrap;
	gap: 28px;
	margin-top: 48px;
}

.testimonials-carousel--text .testimonials-nav {
	display: contents;
}

.testimonials-carousel--text [data-testimonial-dir="1"] {
	order: 2;
}

.testimonials-carousel--text .testimonials-controls .testimonial-dots {
	order: 1;
	flex: 0 1 380px;
}

.testimonial-card-tag {
	margin: 0 0 18px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
}

@media (max-width: 767px) {
	.testimonials-carousel--text .testimonials-controls {
		gap: 16px;
	}

	.testimonials-carousel--text .testimonials-controls .testimonial-dots {
		flex: 1 1 auto;
	}
}

/* Testimonials page: three real columns filled in page-testimonials.php
   (not CSS multi-column, which Safari re-balanced while the page loaded),
   so opening one story only lengthens its own column. */
.testimonials-page-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	align-items: start;
}

.testimonials-page-column {
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
}

.testimonial-page-card {
	display: block;
	margin: 0;
	padding: 0;
	background: var(--color-white);
}

@media (max-width: 900px) {
	.testimonials-page-card-grid {
		display: flex;
		flex-direction: column;
		max-width: 640px;
		margin: 0 auto;
	}

	.testimonials-page-column {
		display: contents;
	}
}

.testimonial-page-card-photo {
	margin: 0;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.testimonial-page-card-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.8s ease;
}

.testimonial-page-card:hover .testimonial-page-card-photo img {
	transform: scale(1.04);
}

.testimonial-page-card-body {
	padding: 4px 26px 24px;
}

.testimonial-page-card .testimonial-card-mark {
	height: 44px;
	font-size: 84px;
}

.testimonial-page-card-quote {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: 19px;
	line-height: 1.55;
	color: var(--color-heading);
}

.testimonial-page-card-more {
	margin: -8px 0 18px;
}

.testimonial-page-card-more summary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	list-style: none;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-primary);
	cursor: pointer;
}

.testimonial-page-card-more summary::-webkit-details-marker {
	display: none;
}

.testimonial-page-card-more summary i {
	font-size: 10px;
	transition: transform 0.2s ease;
}

.testimonial-page-card-more[open] summary i {
	transform: rotate(180deg);
}

.testimonial-more-close,
.testimonial-page-card-more[open] .testimonial-more-open {
	display: none;
}

.testimonial-page-card-more[open] .testimonial-more-close {
	display: inline;
}

/* Open: the full story replaces the excerpt, summary moves below it. */
.testimonial-page-card:has(.testimonial-page-card-more[open]) .testimonial-page-card-excerpt {
	display: none;
}

.testimonial-page-card-more[open] {
	display: flex;
	flex-direction: column-reverse;
	gap: 14px;
	margin-top: 0;
}

.testimonial-page-card-full {
	font-size: 15px;
	line-height: 1.75;
	color: var(--color-text);
}

.testimonial-page-card-full p {
	margin: 0 0 12px;
}

[data-theme="dark"] .testimonial-page-card {
	background: var(--dm-surface);
}



/* Hotel showcase quotes carry their hotel's photo. */
.hotel-quote {
	padding-top: 0;
}

.hotel-quote-photo {
	position: relative;
	margin: 0 -28px 22px;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.hotel-quote-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.testimonials-page-section {
	padding: var(--section-space) 0;
	background: var(--color-light-bg);
}

[data-theme="dark"] .testimonials-page-section {
	background: var(--dm-bg);
}

/* -----------------------------------------------------------------------
   51. About Us (page-about.php) - Tully-style: mission statement over a
   three-photo strip, Key Stats, Why Choose Us with tall captioned photos
   and six reasons, alternating photo rows for the story, press logos.
   ----------------------------------------------------------------------- */
.about-lead {
	padding: var(--section-space-lg) 0 0;
	text-align: center;
}

.about-lead-statement {
	max-width: 900px;
	margin: 0 auto 32px;
	font-family: var(--font-heading);
	font-size: clamp(28px, 3.2vw, 44px);
	line-height: 1.3;
	color: var(--color-heading);
}

.about-lead-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px;
}

.about-strip {
	display: grid;
	grid-template-columns: 1fr 1.35fr 1fr;
	align-items: end;
	gap: 16px;
	max-width: 1440px;
	margin: var(--section-space-lg) auto 0;
	padding: 0 16px;
}

.about-strip-item {
	margin: 0;
	overflow: hidden;
}

.about-strip-item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.about-strip-item--1,
.about-strip-item--3 {
	aspect-ratio: 4 / 5;
}

.about-strip-item--2 {
	aspect-ratio: 4 / 4.3;
}

.about-lead + .stats-section {
	margin-top: calc(var(--section-space-lg) * -1);
	padding-top: calc(var(--section-space-lg) + var(--section-space));
}

/* Why Choose Us */
.about-why {
	padding: var(--section-space-lg) 0;
}

.about-why-top {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr);
	gap: clamp(32px, 5vw, 72px);
	align-items: center;
}

.about-why-intro .section-eyebrow,
.about-why-intro .section-heading {
	text-align: left;
}

.about-why-intro .section-heading {
	margin-bottom: 18px;
}

.about-why-intro p {
	margin: 0 0 26px;
}

.about-why-photos {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.about-why-photo {
	position: relative;
	margin: 0;
	aspect-ratio: 2 / 3.1;
	overflow: hidden;
}

.about-why-photo:nth-child(2) {
	transform: translateY(32px);
}

.about-why-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.8s ease;
}

.about-why-photo:hover img {
	transform: scale(1.05);
}

.about-why-photo figcaption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 60px 18px 18px;
	background: linear-gradient(180deg, rgba(9, 19, 28, 0) 0%, rgba(9, 19, 28, 0.8) 100%);
	font-family: var(--font-heading);
	font-size: 22px;
	line-height: 1.2;
	color: var(--color-white);
}

.about-reasons {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	margin: calc(var(--section-space-lg) + 16px) 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--color-gold);
}

.about-reasons li {
	padding: 32px 30px 30px 0;
	border-bottom: 1px solid var(--color-border);
}

.about-reasons li:nth-child(3n+2),
.about-reasons li:nth-child(3n+3) {
	padding-left: 30px;
	border-left: 1px solid var(--color-border);
}

.about-reasons i {
	font-size: 22px;
	color: var(--color-primary);
}

.about-reasons h3 {
	margin: 14px 0 8px;
	font-size: 25px;
}

.about-reasons p {
	margin: 0;
	font-size: 15px;
}

/* Our Story */
.about-story {
	padding: var(--section-space-lg) 0;
	background: var(--color-light-bg);
}

.about-story-header {
	max-width: 720px;
	margin: 0 auto;
}

.about-story .about-intro-row {
	max-width: none;
	padding: 0 0 var(--section-space-lg);
}

.about-story .about-intro-row > .wp-block-group__inner-container {
	align-items: center;
	gap: clamp(32px, 5vw, 72px);
}

.about-story .about-intro-text p {
	font-size: 17px;
}

.about-features > .wp-block-group__inner-container {
	display: grid;
	gap: var(--section-space-lg);
}

.about-feature > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: clamp(32px, 5vw, 80px);
	align-items: center;
}

.about-feature--reverse > .wp-block-group__inner-container > .about-feature-media {
	order: 2;
}

.about-feature-media {
	margin: 0;
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.about-feature-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.about-feature-number {
	margin: 0 0 8px !important;
	font-family: var(--font-heading);
	font-size: 22px;
	color: var(--color-gold);
}

.about-feature-text h3 {
	margin: 0 0 16px;
	font-size: clamp(30px, 3vw, 42px);
}

.about-feature-text p {
	margin: 0;
}

.about-press .container {
	border-top: 0;
}

.about-press .section-eyebrow {
	color: var(--color-muted);
}

.about-team {
	padding-top: var(--section-space-lg);
}

[data-theme="dark"] .about-story {
	background: var(--dm-surface);
}

@media (max-width: 1024px) {
	.about-why-top {
		grid-template-columns: minmax(0, 1fr);
	}

	.about-reasons {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.about-reasons li:nth-child(n) {
		padding: 28px 24px 26px 0;
		border-left: 0;
	}

	.about-reasons li:nth-child(2n) {
		padding-left: 24px;
		border-left: 1px solid var(--color-border);
	}
}

@media (max-width: 782px) {
	.about-strip {
		grid-template-columns: 1fr 1fr;
	}

	.about-strip-item--2 {
		grid-column: 1 / -1;
		grid-row: 1;
		aspect-ratio: 3 / 2;
	}

	.about-feature > .wp-block-group__inner-container {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	.about-feature--reverse > .wp-block-group__inner-container > .about-feature-media {
		order: 0;
	}
}

@media (max-width: 600px) {
	.about-why-photos {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 8px;
	}

	.about-why-photo figcaption {
		padding: 40px 8px 10px;
		font-size: 15px;
	}

	.about-why-photo:nth-child(2) {
		transform: translateY(16px);
	}

	.about-reasons {
		grid-template-columns: minmax(0, 1fr);
	}

	.about-reasons li:nth-child(n) {
		padding: 24px 0;
		border-left: 0;
	}
}

.about-feature--reverse > .wp-block-group__inner-container {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
}

/* -----------------------------------------------------------------------
   52. Accessibility menu (inc/accessibility.php, assets/js/accessibility.js)
   ----------------------------------------------------------------------- */
.a11y-widget {
	position: fixed;
	left: 20px;
	bottom: 20px;
	z-index: 1001;
}

.consent-banner-open .a11y-widget {
	bottom: 150px;
}

.a11y-toggle {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 2px solid var(--color-white);
	border-radius: 50%;
	background: var(--color-cta);
	color: var(--color-white);
	font-size: 26px;
	box-shadow: 0 6px 20px rgba(9, 19, 28, 0.25);
	cursor: pointer;
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.a11y-toggle:hover,
.a11y-toggle:focus-visible {
	transform: scale(1.06);
	background: var(--color-primary-deep);
}

.a11y-toggle:focus-visible {
	outline: 3px solid var(--color-gold);
	outline-offset: 3px;
}

.a11y-widget.is-active .a11y-toggle::after {
	content: "";
	position: absolute;
	top: 2px;
	right: 2px;
	width: 12px;
	height: 12px;
	border: 2px solid var(--color-white);
	border-radius: 50%;
	background: var(--color-gold);
}

.a11y-panel {
	position: absolute;
	left: 0;
	bottom: 66px;
	width: min(340px, calc(100vw - 32px));
	max-height: calc(100vh - 120px);
	overflow-y: auto;
	padding: 20px;
	background: var(--color-white);
	border-top: 2px solid var(--color-gold);
	box-shadow: 0 18px 50px rgba(9, 19, 28, 0.25);
	color: var(--color-text);
	font-size: 14px;
}

.a11y-panel[hidden] {
	display: none;
}

.a11y-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 14px;
}

.a11y-panel-header h2 {
	margin: 0;
	font-size: 26px;
}

.a11y-close {
	width: 36px;
	height: 36px;
	border: 0;
	background: none;
	color: var(--color-heading);
	font-size: 18px;
	cursor: pointer;
}

.a11y-text-size {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	margin-bottom: 12px;
	background: var(--color-light-bg);
	font-weight: 500;
	color: var(--color-heading);
}

.a11y-text-size-controls {
	display: flex;
	align-items: center;
	gap: 8px;
}

.a11y-text-size-controls button {
	width: 40px;
	height: 36px;
	border: 1px solid var(--color-heading);
	background: var(--color-white);
	color: var(--color-heading);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.a11y-text-size-controls button:hover,
.a11y-text-size-controls button:focus-visible {
	background: var(--color-heading);
	color: var(--color-white);
}

.a11y-text-size-value {
	min-width: 46px;
	text-align: center;
}

.a11y-options {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.a11y-option {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 86px;
	padding: 12px 8px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
	color: var(--color-heading);
	font: inherit;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.a11y-option i {
	font-size: 20px;
	color: var(--color-primary);
}

.a11y-option:hover,
.a11y-option:focus-visible {
	border-color: var(--color-primary);
}

.a11y-option[aria-pressed="true"] {
	border-color: var(--color-cta);
	background: var(--color-cta);
	color: var(--color-white);
}

.a11y-option[aria-pressed="true"] i {
	color: var(--color-white);
}

.a11y-reset {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	margin-top: 12px;
	padding: 12px;
	border: 1px solid var(--color-heading);
	background: none;
	color: var(--color-heading);
	font: inherit;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	cursor: pointer;
}

.a11y-note {
	margin: 10px 0 0;
	font-size: 12px;
	color: var(--color-muted);
	text-align: center;
}

[data-theme="dark"] .a11y-panel,
[data-theme="dark"] .a11y-option,
[data-theme="dark"] .a11y-text-size-controls button {
	background: var(--dm-surface);
	color: var(--dm-heading);
}

[data-theme="dark"] .a11y-text-size {
	background: var(--dm-bg);
	color: var(--dm-heading);
}

[data-theme="dark"] .a11y-panel-header h2,
[data-theme="dark"] .a11y-close,
[data-theme="dark"] .a11y-reset {
	color: var(--dm-heading);
}

/* Tablets and phones: the round floating button sat on top of the body
   text (it covered the start of lines all down the page), so there it
   moves into the menu ("Accessibility" under the menu links, header.php)
   and the panel opens from the bottom-left corner as before. */
@media (max-width: 1024px) {
	.a11y-widget {
		left: 14px;
		bottom: 14px;
	}

	.a11y-toggle {
		display: none;
	}

	.consent-banner-open .a11y-widget {
		bottom: 180px;
	}
}

.nav-overlay-a11y {
	display: none;
}

@media (max-width: 1024px) {
	.nav-overlay-a11y {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		margin-top: 22px;
		padding: 0;
		background: none;
		border: none;
		font-family: var(--font-body);
		font-size: 12px;
		font-weight: 500;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: rgba(255, 255, 255, 0.75);
		cursor: pointer;
	}

	.nav-overlay-a11y i {
		font-size: 18px;
	}
}

/* --- The settings themselves --- */

/* Text size: scales the page content and footer (not the fixed header). */
.a11y-text-1 .site-main,
.a11y-text-1 .site-footer {
	zoom: 1.15;
}

.a11y-text-2 .site-main,
.a11y-text-2 .site-footer {
	zoom: 1.3;
}

.a11y-text-3 .site-main,
.a11y-text-3 .site-footer {
	zoom: 1.45;
}

.a11y-text-4 .site-main,
.a11y-text-4 .site-footer {
	zoom: 1.6;
}

/* High contrast: darker text, borders and image scrims. */
html.a11y-contrast:not([data-theme="dark"]) {
	--color-text: #000;
	--color-muted: #262626;
	--color-heading: #000;
	--color-gold: #5e4718;
	--color-border: #6b6b6b;
	--color-primary: #004766;
	--color-overlay: rgba(0, 0, 0, 0.72);
}

html.a11y-contrast[data-theme="dark"] {
	--color-text: #fff;
	--color-muted: #e8e8e8;
	--dm-heading: #fff;
	--color-gold: #e2c48a;
	--color-border: #8a9399;
}

.a11y-contrast .page-hero::before,
.a11y-contrast .final-cta--photo::before {
	background: rgba(0, 0, 0, 0.72);
}

/* Highlight links */
.a11y-links a:not(.btn) {
	text-decoration: underline !important;
	text-decoration-thickness: 2px !important;
	text-underline-offset: 3px;
}

.a11y-links a:hover,
.a11y-links a:focus {
	background: #ffe066 !important;
	color: #000 !important;
	outline: 2px solid #000;
}

/* Readable font: a plain sans-serif everywhere, no italics. */
html.a11y-font {
	--font-heading: Verdana, Tahoma, Arial, sans-serif;
	--font-body: Verdana, Tahoma, Arial, sans-serif;
	--font-accent: Verdana, Tahoma, Arial, sans-serif;
}

.a11y-font em,
.a11y-font i:not([class*="fa"]),
.a11y-font blockquote,
.a11y-font [class*="quote"] {
	font-style: normal !important;
}

/* Text spacing (WCAG 1.4.12 values). */
.a11y-spacing .site-main,
.a11y-spacing .site-footer {
	letter-spacing: 0.06em;
	word-spacing: 0.16em;
}

.a11y-spacing .site-main p,
.a11y-spacing .site-main li,
.a11y-spacing .site-main td,
.a11y-spacing .site-footer li {
	line-height: 2 !important;
}

.a11y-spacing .site-main p {
	margin-bottom: 1.6em;
}

/* Pause animations: marquee, slideshows, transitions (theme.js also
   stops autoplay and the hero slideshow). */
.a11y-pause *,
.a11y-pause *::before,
.a11y-pause *::after {
	animation: none !important;
	transition: none !important;
	scroll-behavior: auto !important;
}

/* Large cursor */
.a11y-cursor,
.a11y-cursor * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 10-7 1.5L9.5 21z' fill='%23000' stroke='%23fff' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, auto !important;
}

/* -----------------------------------------------------------------------
   53. CAPTCHA (inc/captcha.php) - privacy-friendly proof-of-work check
   ----------------------------------------------------------------------- */
.captcha-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 16px;
	max-width: 420px;
	margin: 4px 0 20px;
	padding: 14px 16px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
}

.captcha-field.has-error {
	border-color: #b3261e;
}

.captcha-check {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--color-heading);
	cursor: pointer;
}

.captcha-box {
	position: absolute;
	width: 26px;
	height: 26px;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.captcha-indicator {
	position: relative;
	display: inline-block;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border: 2px solid var(--color-muted);
	background: var(--color-white);
}

.captcha-box:focus-visible + .captcha-indicator {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

.captcha-field.is-verifying .captcha-indicator {
	border-color: var(--color-primary);
	border-right-color: transparent;
	border-radius: 50%;
	animation: captcha-spin 0.8s linear infinite;
}

.captcha-field.is-verified .captcha-indicator {
	border-color: #2e7d4f;
	background: #2e7d4f;
}

.captcha-field.is-verified .captcha-indicator::after {
	content: "";
	position: absolute;
	left: 7px;
	top: 2px;
	width: 7px;
	height: 13px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.captcha-field.is-failed .captcha-indicator {
	border-color: #b3261e;
}

@keyframes captcha-spin {
	to {
		transform: rotate(360deg);
	}
}

.captcha-brand {
	font-size: 11px;
	color: var(--color-muted);
}

.captcha-brand i {
	color: var(--color-gold);
}

.captcha-error {
	flex-basis: 100%;
	margin: 4px 0 0;
	font-size: 13px;
	color: #b3261e;
}

[data-theme="dark"] .captcha-field,
[data-theme="dark"] .captcha-indicator {
	background: var(--dm-surface);
}

[data-theme="dark"] .captcha-check {
	color: var(--dm-heading);
}

@media (max-width: 782px) {
	.about-feature--reverse > .wp-block-group__inner-container {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -----------------------------------------------------------------------
   54. Brochure (page-brochure.php) - cover beside the intro and download
   button, then every spread in a scroller with arrows.
   ----------------------------------------------------------------------- */
.brochure-intro {
	padding: var(--section-space-lg) 0 var(--section-space);
}

.brochure-intro-grid {
	display: grid;
	grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: center;
}

.brochure-cover {
	display: block;
	box-shadow: 18px 18px 0 var(--color-light-bg);
	outline: 1px solid rgba(168, 138, 85, 0.45);
	outline-offset: 10px;
	transition: transform 0.3s ease;
}

.brochure-cover:hover,
.brochure-cover:focus-visible {
	transform: translateY(-4px);
}

.brochure-cover img {
	display: block;
	width: 100%;
	height: auto;
}

.brochure-intro-text .section-eyebrow,
.brochure-intro-text .section-heading {
	text-align: left;
}

.brochure-intro-text .section-heading {
	margin-bottom: 20px;
}

.brochure-contents {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 24px;
	margin: 24px 0 32px;
	padding: 0;
	list-style: none;
}

.brochure-contents li {
	position: relative;
	padding-left: 22px;
}

.brochure-contents li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.75em;
	width: 12px;
	height: 1px;
	background: var(--color-gold);
}

.brochure-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

.brochure-file-note {
	margin-top: 14px;
	font-size: 13px;
	opacity: 0.7;
}

.brochure-preview {
	padding: var(--section-space) 0 var(--section-space-lg);
	background: var(--color-light-bg);
}

.brochure-preview-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 28px;
}

.brochure-preview-header .section-eyebrow,
.brochure-preview-header .section-heading {
	text-align: left;
	margin-bottom: 0;
}

.brochure-preview-header .section-eyebrow {
	margin-bottom: 12px;
}

.brochure-scroller {
	display: flex;
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.brochure-scroller::-webkit-scrollbar {
	display: none;
}

.brochure-scroller:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 6px;
}

.brochure-spread {
	flex: 0 0 auto;
	height: clamp(220px, 34vw, 440px);
	scroll-snap-align: start;
	background: #fff;
	box-shadow: 0 1px 0 rgba(14, 28, 41, 0.08);
}

.brochure-spread a,
.brochure-spread img {
	display: block;
	height: 100%;
	width: auto;
}

.brochure-preview .carousel-progress--light {
	background: rgba(14, 28, 41, 0.12);
}

.brochure-note {
	margin-top: 20px;
	font-size: 14px;
	opacity: 0.75;
}

[data-theme="dark"] .brochure-preview {
	background: var(--dm-surface);
}

[data-theme="dark"] .brochure-cover {
	box-shadow: 18px 18px 0 rgba(255, 255, 255, 0.06);
}

@media (max-width: 782px) {
	.brochure-intro-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.brochure-cover {
		width: min(72%, 300px);
		margin: 0 auto 12px;
		box-shadow: 12px 12px 0 var(--color-light-bg);
	}

	.brochure-contents {
		grid-template-columns: minmax(0, 1fr);
	}

	.brochure-actions .btn {
		flex: 1 1 100%;
	}

	.brochure-preview-header {
		flex-wrap: wrap;
	}

	/* A spread fills the screen width on phones; swipe for the next. */
	.brochure-spread {
		height: auto;
		width: calc(100vw - 48px);
	}

	.brochure-spread--single {
		width: calc((100vw - 48px) * 0.49);
	}

	.brochure-spread a,
	.brochure-spread img {
		width: 100%;
		height: auto;
	}
}

/* -----------------------------------------------------------------------
   55. Packages on phones (client, 2026-10-06: "the packages are not showing
   correctly" on mobile). The comparison table becomes one swipeable card
   per package; the popular-package photos go one per row so the names
   don't break; package tiers become compact rows, tappable anywhere.
   ----------------------------------------------------------------------- */
.compare-cards-header,
.compare-cards,
.compare-cards-progress {
	display: none;
}

/* Long URLs in imported page text must wrap instead of pushing the page
   wider than the phone. */
.entry-content,
.package-hub-intro,
.wp-block-paragraph {
	overflow-wrap: anywhere;
}

@media (max-width: 767px) {
	/* Comparison: cards instead of the table. */
	.package-comparison .table-wrapper {
		display: none;
	}

	.compare-cards-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		margin-bottom: 18px;
	}

	.compare-cards-hint {
		margin: 0;
		font-size: 12px;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--color-muted);
	}

	.compare-cards {
		display: flex;
		gap: 14px;
		margin: 0;
		padding: 0;
		list-style: none;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.compare-cards::-webkit-scrollbar {
		display: none;
	}

	.compare-cards:focus-visible {
		outline: 2px solid var(--color-gold);
		outline-offset: 4px;
	}

	.compare-card {
		flex: 0 0 84%;
		scroll-snap-align: start;
		display: flex;
		flex-direction: column;
		border: 1px solid var(--color-border);
		background: var(--color-white);
	}

	.compare-card-title {
		margin: 0;
		padding: 18px 20px;
		font-size: 26px;
		font-weight: 500;
		line-height: 1.15;
		color: var(--color-white);
		background: var(--color-navy);
	}

	.compare-card-list {
		flex: 1;
		margin: 0;
		padding: 4px 20px;
	}

	.compare-card-list > div {
		display: flex;
		justify-content: space-between;
		gap: 16px;
		padding: 12px 0;
		border-bottom: 1px solid var(--color-border);
	}

	.compare-card-list > div:last-child {
		border-bottom: none;
	}

	.compare-card-list dt {
		flex-shrink: 0;
		font-size: 13px;
		font-weight: 500;
		color: var(--color-heading);
	}

	.compare-card-list dd {
		margin: 0;
		font-size: 14px;
		text-align: right;
		color: var(--color-text);
	}

	.compare-card .btn {
		margin: 4px 20px 20px;
	}

	.compare-cards-progress {
		display: block;
		margin-top: 22px;
		background: rgba(14, 28, 41, 0.12);
	}

	[data-theme="dark"] .compare-card {
		background: var(--dm-surface);
	}

	[data-theme="dark"] .compare-card-list dt {
		color: var(--dm-heading);
	}

	[data-theme="dark"] .compare-cards-progress {
		background: rgba(255, 255, 255, 0.16);
	}

	/* Popular packages: two cards per row, captions beneath. */
	.category-column-title {
		font-size: 19px;
	}

	/* Package tiers (hub pages and /packages/): compact rows, the whole row
	   is the link. */
	.package-hub-tiers {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}

	.package-hub-tier {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas:
			"title action"
			"meta action";
		align-items: center;
		gap: 6px 16px;
		padding: 18px 18px 18px 20px;
		text-align: left;
	}

	.package-hub-tier h3 {
		grid-area: title;
		font-size: 22px;
	}

	.package-hub-tier p {
		grid-area: meta;
		justify-content: flex-start;
		font-size: 12.5px;
	}

	.package-hub-tier .btn-tier {
		grid-area: action;
		padding: 10px 14px;
		font-size: 10px;
		letter-spacing: 0.12em;
	}

	.package-hub-tier .btn-tier::after {
		content: "";
		position: absolute;
		inset: 0;
	}

	.package-archive-group .about-section-header {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		margin-bottom: 18px;
	}

	.package-archive-group .about-section-header .section-heading {
		margin: 0;
		text-align: left;
	}

	.package-archive-group .about-section-header .btn {
		padding: 10px 16px;
		font-size: 10px;
	}

	.package-archive-group + .package-archive-group {
		margin-top: 36px;
	}

	.package-archive .package-hub-tiers {
		margin-bottom: 0;
	}

	/* "With or without hotel" / "Begin any day" reassurances. */
	.packages-highlights {
		margin-bottom: 32px;
	}

	.packages-highlight {
		flex-basis: 100%;
		justify-content: flex-start;
		padding: 18px 4px;
	}

	.packages-highlight span {
		font-size: 19px;
	}
}

@media (max-width: 767px) {
	/* Tier rows: a round arrow instead of the worded button, so package
	   names keep the row's width (the text stays for screen readers). */
	.package-hub-tier .btn-tier {
		width: 44px;
		height: 44px;
		padding: 0;
		border-radius: 50%;
		font-size: 0;
		letter-spacing: 0;
	}

	.package-hub-tier .btn-tier i,
	.package-hub-tier .btn-tier .fa-arrow-right {
		display: inline-block;
		font-size: 14px;
	}

	.compare-cards-hint {
		font-size: 11px;
		letter-spacing: 0.1em;
	}
}

/* -----------------------------------------------------------------------
   56. Online booking (inc/bookings.php): the booking form on package pages
   (template-parts/content/package-booking.php), the booking status on the
   confirmation page, the guest's balance page and the Tango Experience
   Book Now buttons. Built from the experience booking form's styles.
   ----------------------------------------------------------------------- */
.page-hero-cta {
	position: relative;
	z-index: 1;
	margin: 6px 0 22px;
}

.package-booking {
	padding: var(--section-space-lg) 0;
	background: var(--color-light-bg);
	scroll-margin-top: 72px;
}

.package-booking-header {
	margin-bottom: 36px;
}

.package-booking-header .section-heading {
	margin-bottom: 14px;
}

.package-booking-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
	gap: 28px;
	align-items: start;
}

.package-booking-fields {
	padding: 32px 32px 18px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
}

.package-booking-step {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 6px 0 18px;
	font-size: 24px;
	font-weight: 500;
}

.package-booking-step:not(:first-child) {
	margin-top: 22px;
	padding-top: 24px;
	border-top: 1px solid var(--color-border);
}

.package-booking-step span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--color-navy);
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: 13px;
}

.package-booking-occupancy {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.package-booking-form .experience-option-choice-label small {
	display: block;
	margin-top: 2px;
	font-size: 12.5px;
	color: var(--color-muted);
}

.package-booking-form .experience-field > legend .experience-optional {
	margin-left: 8px;
	text-decoration: underline;
}

.package-booking-summary {
	position: sticky;
	top: 96px;
	padding: 28px 26px 24px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-gold);
}

.package-booking-summary h3 {
	margin: 0 0 6px;
	font-size: 26px;
	font-weight: 500;
}

.package-booking-summary-title {
	margin: 0 0 18px;
	color: var(--color-heading);
}

.package-booking-summary-title span {
	display: block;
	font-size: 13px;
	color: var(--color-muted);
}

.package-booking-lines {
	margin: 0 0 16px;
	padding: 12px 0 0;
	border-top: 1px solid var(--color-border);
}

.package-booking-lines > div {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	font-size: 14px;
}

.package-booking-lines dd {
	margin: 0;
	white-space: nowrap;
}

.package-booking-total {
	font-weight: 500;
	color: var(--color-heading);
}

.package-booking-plan {
	margin-bottom: 14px;
}

.package-booking-plan .experience-option-choice.is-disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.package-booking-note {
	margin: 4px 0 0;
	font-size: 13px;
	color: var(--color-sunset);
}

.package-booking-submit {
	min-height: 58px;
	font-size: 13px;
}

.package-booking-policy {
	margin: 18px 0 0;
	padding: 16px 0 0 18px;
	border-top: 1px solid var(--color-border);
	font-size: 13px;
	line-height: 1.6;
	color: var(--color-muted);
}

.package-booking-policy li + li {
	margin-top: 6px;
}

.package-booking .form-notice {
	margin-bottom: 20px;
}

/* Tango Experience: a Book Now button on every card + the full-payment line. */
.experience-card-book {
	width: 100%;
	margin-top: 18px;
}

.experience-full-payment {
	margin: 0 0 12px;
	font-size: 13.5px;
	color: var(--color-heading);
}

.experience-full-payment i {
	margin-right: 6px;
	color: #2e7d32;
}

/* Payment step breakdown (page-verify-order.php). */
.booking-review-breakdown {
	margin: 0 0 4px;
}

/* Booking status: confirmation page and balance page. */
.booking-status {
	max-width: 760px;
	margin: 0 auto 40px;
	padding: 32px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-gold);
}

.booking-status-header .section-eyebrow {
	text-align: left;
	margin-bottom: 8px;
}

.booking-status-header h2 {
	margin: 0 0 6px;
	font-size: 30px;
}

.booking-status-header p:last-child {
	margin: 0 0 20px;
	color: var(--color-muted);
}

.booking-status-balance {
	font-weight: 500;
	color: var(--color-heading);
}

.booking-status-next {
	margin: 20px 0 16px;
	font-size: 14.5px;
}

.pay-balance-page {
	padding: var(--section-space) 20px var(--section-space-lg);
}

/* Booking confirmation: the Traveler Information Form step. */
.booking-status-next-step {
	margin-top: 28px;
	padding: 24px 26px;
	background: var(--color-light-bg);
	border-top: 1px solid var(--color-gold);
}

.booking-status-next-step h3 {
	margin: 0 0 8px;
	font-size: 24px;
}

.booking-status-next-step p {
	margin: 0 0 18px;
	font-size: 14.5px;
	line-height: 1.7;
}

.booking-status-next-step .btn + .btn {
	margin-left: 10px;
}

/* Traveler Information Form (page-traveler-information.php). */
.traveler-info-page {
	padding-block: var(--section-space) var(--section-space-lg);
}

.traveler-info-page .form-notice {
	margin-bottom: 24px;
}

.traveler-info-person {
	margin: 0 0 18px;
	padding: 18px 20px 4px;
	border: 1px solid var(--color-border);
}

.traveler-info-person legend {
	padding: 0 8px;
	font-family: var(--font-heading);
	font-size: 20px;
}

.traveler-info-intro,
.traveler-info-privacy {
	margin: 0 0 14px;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--color-muted);
}

.traveler-info-privacy {
	margin-top: 16px;
}

.traveler-info-form .experience-submit {
	margin-top: 12px;
}

@media (max-width: 600px) {
	.booking-status-next-step .btn {
		display: block;
		width: 100%;
	}

	.booking-status-next-step .btn + .btn {
		margin: 10px 0 0;
	}
}

.pay-balance-history {
	max-width: 760px;
	margin: 0 auto 48px;
}

.pay-balance-history h3 {
	font-size: 22px;
	margin-bottom: 10px;
}

.pay-balance-history ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pay-balance-history li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid var(--color-border);
	font-size: 14.5px;
}

.pay-balance-heading {
	margin-bottom: 12px;
}

.pay-balance-options {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin-top: 32px;
}

.pay-balance-option {
	padding: 28px 26px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
}

.pay-balance-option--card {
	border-top: 3px solid var(--color-gold);
}

.pay-balance-option h3 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 6px;
	font-size: 24px;
}

.pay-balance-option h3 i {
	font-size: 18px;
	color: var(--color-gold);
}

.pay-balance-tag {
	margin: 0 0 16px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.pay-balance-option p {
	font-size: 14.5px;
}

.pay-balance-details {
	margin: 0 0 14px;
	padding: 14px 16px;
	background: var(--color-light-bg);
	font-size: 14.5px;
	overflow-wrap: anywhere;
}

.pay-balance-charge {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 14px;
}

[data-theme="dark"] .package-booking {
	background: var(--dm-bg);
}

[data-theme="dark"] .package-booking-fields,
[data-theme="dark"] .package-booking-summary,
[data-theme="dark"] .booking-status,
[data-theme="dark"] .pay-balance-option {
	background: var(--dm-surface);
	color: var(--dm-heading);
}

@media (max-width: 1024px) {
	.package-booking-grid,
	.pay-balance-options {
		grid-template-columns: minmax(0, 1fr);
	}

	.package-booking-summary {
		position: static;
	}
}

@media (max-width: 700px) {
	.package-booking-fields {
		padding: 22px 18px 6px;
	}

	.package-booking-summary,
	.booking-status,
	.pay-balance-option {
		padding: 22px 18px;
	}

	.package-booking-occupancy {
		grid-template-columns: minmax(0, 1fr);
	}

	.page-hero-cta {
		width: 100%;
		max-width: 340px;
	}

	.pay-balance-page {
		padding-inline: 20px;
	}
}

.package-booking-plan > .experience-option-choice {
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

/* -----------------------------------------------------------------------
   57. Reservation flow (client brief 2026-10-16: "feel like a luxury travel
   reservation, not an inquiry form"): the booking summary card beside the
   package introduction, the hotel classes on package pages, the five-step
   "Reserve Your Place" form with its two payment options, the trust row,
   the phone "Reserve" bar, and the deposit wording on the confirmation.
   ----------------------------------------------------------------------- */
.package-overview {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
	gap: clamp(32px, 5vw, 72px);
	align-items: start;
	margin-bottom: var(--section-space-lg);
}

.package-overview-main .section-eyebrow {
	text-align: left;
}

.package-overview-lead {
	margin: 0 0 32px;
	font-family: var(--font-heading);
	font-size: clamp(22px, 2.1vw, 28px);
	line-height: 1.45;
	color: var(--color-heading);
}

.package-overview .package-intro {
	margin-bottom: 32px;
}

.package-overview .packages-highlights {
	flex-direction: column;
	max-width: none;
	margin: 0;
}

.package-overview .packages-highlight {
	flex: none;
	justify-content: flex-start;
	padding: 18px 0;
}

.package-overview .packages-highlight + .packages-highlight {
	border-left: 0;
	border-top: 1px solid var(--color-border);
}

.package-summary-card {
	position: sticky;
	top: calc(var(--masthead-row, 80px) + 24px);
	padding: 32px 30px 26px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-gold);
}

.package-summary-eyebrow {
	margin: 0 0 10px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.package-summary-title {
	margin: 0 0 4px;
	font-size: clamp(26px, 2.4vw, 32px);
	font-weight: 400;
	line-height: 1.15;
}

.package-summary-duration {
	margin: 0 0 20px;
	font-size: 14px;
	letter-spacing: 0.06em;
	color: var(--color-muted);
}

.package-summary-list {
	margin: 0 0 22px;
	padding: 18px 0 0;
	list-style: none;
	border-top: 1px solid var(--color-border);
}

.package-summary-list li {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 5px 0;
	font-size: 15px;
	color: var(--color-heading);
}

.package-summary-list i {
	flex: none;
	font-size: 12px;
	color: var(--color-gold);
}

.package-summary-price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 10px;
	margin: 0 0 18px;
	padding-top: 18px;
	border-top: 1px solid var(--color-border);
}

.package-summary-price span {
	flex-basis: 100%;
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-muted);
}

.package-summary-price strong {
	font-family: var(--font-heading);
	font-size: 40px;
	font-weight: 400;
	line-height: 1;
	color: var(--color-heading);
}

.package-summary-price small {
	font-size: 14px;
	color: var(--color-muted);
}

.package-summary-cta {
	width: 100%;
}

.package-summary-note {
	margin: 12px 0 0;
	font-size: 13px;
	text-align: center;
	color: var(--color-muted);
}

.package-includes-column h3 {
	display: flex;
	align-items: center;
	gap: 10px;
}

.package-includes-column h3 i {
	font-size: 16px;
	color: var(--color-gold);
}

/* Hotel classes on a package page. */
.package-hotels {
	margin-bottom: 60px;
}

.package-hotels-header {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px 32px;
	margin-bottom: 28px;
}

.package-hotels-header .section-heading,
.package-hotels-header .section-subtitle {
	text-align: left;
	margin-inline: 0;
}

.package-hotels-header .section-subtitle {
	max-width: 60ch;
	margin-bottom: 0;
}

.package-hotels-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.package-hotel {
	display: flex;
	flex-direction: column;
}

.package-hotel-media {
	aspect-ratio: 4 / 3;
	margin-bottom: 16px;
	overflow: hidden;
	background: var(--color-light-bg);
}

.package-hotel-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.package-hotel-class {
	margin: 0 0 4px;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.package-hotel-class .fa-star {
	margin-right: 2px;
}

.package-hotel h3 {
	margin: 0 0 8px;
	font-size: 24px;
}

.package-hotel p {
	margin: 0 0 12px;
	font-size: 14.5px;
}

.package-hotel .package-hotel-price {
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--color-border);
	font-size: 14px;
	color: var(--color-heading);
}

/* "Reserve Your Place". */
.package-booking-header {
	text-align: center;
}

.package-booking-header .section-subtitle {
	margin-inline: auto;
}

.package-booking-step em {
	font-family: var(--font-body);
	font-size: 11.5px;
	font-style: normal;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.package-booking-persons {
	max-width: 260px;
}

.package-booking-plan {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	border: 0;
}

.package-plan {
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	gap: 16px;
	align-items: start;
	padding: 20px 20px 20px 18px;
	border: 1px solid var(--color-border);
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.experience-field .package-plan input {
	width: 18px;
	height: 18px;
	margin: 4px 0 0;
	padding: 0;
	accent-color: var(--color-primary);
}

.package-booking-form .package-plan {
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--color-text);
}

.package-plan:has(input:checked) {
	border-color: var(--color-heading);
	box-shadow: inset 0 0 0 1px var(--color-heading);
	background: rgba(168, 138, 85, 0.06);
}

.package-plan-body {
	display: grid;
	gap: 4px;
}

.package-plan-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.package-plan-option {
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-muted);
}

.package-plan-badge {
	padding: 2px 8px;
	background: var(--color-gold);
	color: var(--color-white);
	font-size: 10.5px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.package-plan-title {
	font-family: var(--font-heading);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--color-heading);
}

.package-plan-text {
	font-size: 14px;
	line-height: 1.6;
	color: var(--color-text);
}

.package-plan-amount {
	display: grid;
	justify-items: end;
	text-align: right;
}

.package-plan-amount strong {
	font-family: var(--font-heading);
	font-size: 28px;
	font-weight: 500;
	line-height: 1.1;
	color: var(--color-heading);
	white-space: nowrap;
}

.package-plan-amount small {
	font-size: 12px;
	color: var(--color-muted);
}

.package-booking-plan .package-booking-note {
	display: flex;
	gap: 10px;
	margin: 4px 0 0;
	padding: 12px 14px;
	background: var(--color-gold-soft);
	color: var(--color-heading);
	font-size: 13.5px;
}

.package-booking-plan .package-booking-note[hidden] {
	display: none;
}

.package-booking-plan .package-booking-note i {
	margin-top: 4px;
	color: var(--color-gold);
}

.package-booking-balance {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin: -4px 0 16px;
	font-size: 13.5px;
	color: var(--color-muted);
}

.package-booking-balance[hidden],
.package-booking-lines [hidden] {
	display: none;
}

.package-booking-balance strong {
	font-weight: 500;
	color: var(--color-heading);
	white-space: nowrap;
}

/* Trust row: five quiet reassurances between hairlines. */
.booking-trust {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 0;
	max-width: 1040px;
	margin: 28px auto 0;
	padding: 16px 0;
	list-style: none;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}

.booking-trust li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 0 22px;
	font-size: 13px;
	letter-spacing: 0.06em;
	color: var(--color-heading);
}

.booking-trust li + li {
	border-left: 1px solid var(--color-border);
}

.booking-trust i {
	color: var(--color-gold);
}

.experiences-header .booking-trust {
	margin-bottom: 40px;
}

/* Phone-only "From $X · Reserve" bar. */
.package-mobile-bar {
	display: none;
}

@media (max-width: 700px) {
	.package-mobile-bar {
		position: fixed;
		inset: auto 0 0;
		z-index: 90;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		background: var(--color-white);
		border-top: 1px solid var(--color-border);
		box-shadow: 0 -6px 20px rgba(14, 28, 41, 0.08);
		transform: translateY(110%);
		transition: transform 0.3s ease;
	}

	.package-mobile-bar.is-visible {
		transform: none;
	}

	.package-mobile-bar[hidden] {
		display: none;
	}

	.package-mobile-bar p {
		display: flex;
		align-items: baseline;
		gap: 6px;
		margin: 0;
		font-size: 13px;
		color: var(--color-muted);
	}

	.package-mobile-bar strong {
		font-family: var(--font-heading);
		font-size: 26px;
		font-weight: 500;
		color: var(--color-heading);
	}

	.package-mobile-bar .btn {
		min-width: 132px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.package-mobile-bar {
		transition: none;
	}
}

/* Tango Experience: the four booking steps. */
.experience-steps-list--four {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.experience-steps-list--five {
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 24px;
}

.experience-steps .section-eyebrow {
	text-align: center;
}

/* Confirmation page: the deposit and balance wording. */
.booking-status-terms {
	margin-top: 22px;
	font-size: 14.5px;
	line-height: 1.7;
}

.booking-status-terms p {
	margin: 0 0 12px;
}

.booking-status-confirmed {
	display: flex;
	gap: 10px;
	padding: 14px 16px;
	background: var(--color-gold-soft);
	color: var(--color-heading);
	font-weight: 500;
}

.booking-status-confirmed i {
	margin-top: 5px;
	color: #2e7d32;
}

[data-theme="dark"] .package-summary-card,
[data-theme="dark"] .package-mobile-bar {
	background: var(--dm-surface);
}

[data-theme="dark"] .package-plan-title,
[data-theme="dark"] .package-plan-amount strong,
[data-theme="dark"] .package-summary-price strong,
[data-theme="dark"] .booking-status-confirmed,
[data-theme="dark"] .package-booking-plan .package-booking-note {
	color: var(--dm-heading);
}

[data-theme="dark"] .booking-status-confirmed,
[data-theme="dark"] .package-booking-plan .package-booking-note {
	background: rgba(168, 138, 85, 0.16);
}

@media (max-width: 1024px) {
	/* One column: intro, then the summary card straight after it, then the
	   two flexibility notes. */
	.package-overview {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 0;
	}

	.package-overview-main {
		display: contents;
	}

	.package-summary-card {
		order: 1;
		position: static;
		max-width: 560px;
		margin-bottom: 32px;
	}

	.package-overview .packages-highlights {
		order: 2;
	}

	.package-hotels-grid,
	.experience-steps-list--four,
	.experience-steps-list--five {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.package-summary-card {
		padding: 26px 20px 22px;
	}

	.package-hotels-grid,
	.experience-steps-list--four,
	.experience-steps-list--five {
		grid-template-columns: minmax(0, 1fr);
	}

	.package-plan {
		grid-template-columns: auto minmax(0, 1fr);
		padding: 16px 14px;
	}

	.package-plan-amount {
		grid-column: 2;
		justify-items: start;
		text-align: left;
	}

	.package-booking-persons {
		max-width: none;
	}

	.booking-trust {
		justify-content: flex-start;
		padding: 14px 0;
	}

	.booking-trust li {
		flex: 1 1 50%;
		padding: 4px 0;
	}

	.booking-trust li + li {
		border-left: 0;
	}

	/* Room for the fixed Reserve bar under the footer. */
	.single-tour_package .site-footer {
		padding-bottom: 72px;
	}
}

/* Bookable transfers and tango shows (template-parts/content/service-booking.php). */
.service-booking-grid--transfers,
.service-booking-grid--shows {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.service-booking-grid--vehicles {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.service-booking-subheading {
	margin-top: calc(var(--section-space) * 0.75);
}

.service-booking-grid .service-card h3 {
	margin-bottom: 10px;
}

.service-booking-time {
	margin: 0 0 14px;
	font-size: 14px;
	font-weight: 600;
	color: var(--color-primary);
}

.service-booking-grid .service-card-text {
	flex-grow: 1;
}

.service-booking-grid--shows .service-card--quote .service-card-text {
	flex-grow: 0;
	margin-bottom: 16px;
}

.service-booking-grid--vehicles .service-card-bullets {
	margin-bottom: 0;
}

.service-booking-section .service-booking-form {
	max-width: 860px;
	margin: 28px auto 0;
	text-align: left;
}

.service-booking-fieldset {
	margin: 0 0 28px;
	padding: 0;
	border: 0;
}

.service-booking-fieldset legend {
	width: 100%;
	margin-bottom: 14px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--color-border);
	font-family: var(--font-heading);
	font-size: 22px;
	color: var(--color-heading);
}

.service-booking-total {
	margin: 0 0 24px;
	padding: 18px 22px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	font-size: 16px;
	color: var(--color-heading);
}

.service-booking-total:empty {
	display: none;
}

.service-booking-total strong {
	font-size: 22px;
	color: var(--color-primary);
}

.service-booking-note {
	margin-top: 14px;
	font-size: 14px;
	color: var(--color-text);
}

@media (max-width: 1024px) {
	.service-booking-grid--vehicles {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.service-booking-grid--transfers,
	.service-booking-grid--shows,
	.service-booking-grid--vehicles {
		grid-template-columns: minmax(0, 1fr);
	}
}
.form-field[hidden] {
	display: none;
}

/* Services added to the booking engine (client, 2026-10-24). */
.service-booking-grid--partner {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 960px;
	margin-inline: auto;
}

.service-booking-grid--practice,
.service-booking-grid--guide,
.service-booking-grid--quotes {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.service-booking-grid--spanish {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.service-booking-options h3.service-booking-subheading {
	margin: calc(var(--section-space) * 0.5) 0 8px;
	font-size: clamp(22px, 2.4vw, 30px);
	text-align: center;
}

.service-booking-options .service-booking-subheading + .section-subtitle {
	text-align: center;
	margin-bottom: 0;
}

.service-booking-grid .service-card .btn + .btn {
	margin-top: 10px;
}

.feature-service-body .btn + .btn {
	margin-top: 12px;
}

.service-booking-section .section-subtitle {
	text-align: center;
	max-width: 62ch;
	margin-inline: auto;
}

/* Light "Popular with Tango Experience guests" band. */
.cross-promo {
	padding: clamp(40px, 5vw, 64px) 0;
	background: var(--color-gold-soft);
	border-block: 1px solid var(--color-border);
}

.cross-promo-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 32px;
	align-items: center;
}

.cross-promo-text h2 {
	margin-bottom: 10px;
}

.cross-promo-text p:last-child {
	margin: 0;
	max-width: 62ch;
}

.cross-promo-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

@media (max-width: 767px) {
	.cross-promo-inner {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Corporate page: a light statistics band, never mistaken for the footer. */
.stats-section--light {
	background: var(--color-light-bg);
	color: var(--color-text);
	padding: clamp(48px, 6vw, 72px) 0;
	border-block: 1px solid var(--color-border);
}

.stats-section--light .stats-content .section-heading {
	color: var(--color-heading);
	margin-bottom: 28px;
}

.stats-section--light .stat-item + .stat-item {
	border-left-color: var(--color-border);
}

.stats-section--light .stat-value {
	color: var(--color-primary);
	margin-bottom: 10px;
}

.stats-section--light .stat-item h3 {
	color: var(--color-heading);
}

/* Optional enhancements (Tango Experience booking and package form). */
.experience-enhancement-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px 16px;
	margin-top: 8px;
}

.experience-enhancement {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 15px;
	cursor: pointer;
}

.experience-partner-type {
	margin-top: 14px;
}

.experience-partner-type[hidden] {
	display: none;
}

/* Package booking: own hotel note and the Luxury Collection concierge upgrade. */
.package-booking-own-hotel {
	margin: 10px 0 0;
	font-size: 14px;
	color: var(--color-text);
}

.package-booking-own-hotel a {
	text-decoration: underline;
}

.package-luxury-upgrade {
	margin: 18px 0 8px;
	padding: 22px 24px;
	background: var(--color-gold-soft);
	border: 1px solid var(--color-gold);
}

.package-luxury-upgrade h4 {
	margin: 0 0 8px;
	font-family: var(--font-heading);
	font-size: 22px;
}

.package-luxury-upgrade p {
	margin: 0 0 8px;
}

.package-luxury-upgrade ul {
	margin: 0 0 16px;
	padding-left: 20px;
}

.package-booking-due-by {
	margin: 0 0 10px;
	font-size: 14px;
}

.package-booking-lines dd[data-summary="room"] {
	max-width: 22ch;
	text-align: right;
}

@media (max-width: 1024px) {
	.service-booking-grid--spanish {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.service-booking-grid--practice,
	.service-booking-grid--guide,
	.service-booking-grid--quotes {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.service-booking-grid--partner,
	.service-booking-grid--practice,
	.service-booking-grid--guide,
	.service-booking-grid--quotes,
	.service-booking-grid--spanish {
		grid-template-columns: minmax(0, 1fr);
	}

	.experience-enhancement-list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Hotels Our Guests Love: category tag and website link. */
.hotel-partner-tag {
	margin: 0 0 10px;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.hotel-partner-body .btn {
	margin-top: 18px;
}

/* Hotel styles: three cards per row, two rows, so each card has room to
   breathe and stays short (client, 2026-10-28). */
@media (min-width: 801px) {
	.hotel-style-grid--styles > .hotel-style-card {
		flex-basis: calc((100% - 2 * 24px) / 3);
	}
}

/* Planning Your Trip: brighter, with captions over the photos. */
.planning-trip {
	background:
		radial-gradient(ellipse at 85% 0%, rgba(201, 162, 90, 0.22), transparent 55%),
		radial-gradient(ellipse at 0% 100%, rgba(70, 130, 220, 0.28), transparent 50%),
		var(--color-navy);
}

.planning-trip-item {
	overflow: hidden;
}

.planning-trip-item img {
	transition: transform 0.7s ease, filter 0.4s ease;
	filter: saturate(1.12) contrast(1.04);
}

.planning-trip-item::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(8, 18, 40, 0.88) 0%, rgba(8, 18, 40, 0.15) 48%, transparent 70%);
	pointer-events: none;
}

.planning-trip-item span {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	padding: 0 18px 18px;
	font-size: 20px;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}

.planning-trip-item span::before {
	content: "";
	display: block;
	width: 28px;
	height: 2px;
	margin-bottom: 10px;
	background: var(--color-gold);
	transition: width 0.35s ease;
}

.planning-trip-item:hover span::before {
	width: 56px;
}

.planning-trip-item:hover img {
	opacity: 1;
	transform: scale(1.07);
	filter: saturate(1.25) contrast(1.06);
}

.experience-recommended {
	font-style: normal;
	font-size: 0.85em;
	color: var(--color-gold);
}

/* Women's packages: why women choose them. */
.women-why {
	max-width: 880px;
	margin: 0 auto clamp(32px, 5vw, 56px);
	padding: clamp(24px, 4vw, 40px);
	background: var(--color-light-bg);
	border-top: 2px solid var(--color-gold);
}

.women-why-title {
	margin: 0 0 20px;
	font-size: clamp(26px, 3vw, 34px);
	text-align: center;
}

.women-why-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.women-why-list li {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 16px;
	color: var(--color-heading);
}

.women-why-list i {
	margin-top: 4px;
	color: var(--color-gold);
}

@media (max-width: 700px) {
	.women-why-list {
		grid-template-columns: 1fr;
	}
}

/* Pointer to the Traveler Information Form under the booking confirmation. */
.argentina-order-success-note {
	margin: 14px 0 0;
	font-weight: 500;
}

.argentina-order-success-note a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.argentina-order-success-note i {
	margin-left: 6px;
	font-size: 0.85em;
}

/* Tango Experience (client, 2026-10-28): the last row of experience cards is
   centred instead of leaving a gap, and the services section is tightened. */
.experience-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.experience-grid > .experience-card {
	flex: 0 1 calc((100% - 2 * 28px) / 3);
	min-width: 0;
}

@media (max-width: 900px) {
	.experience-grid > .experience-card {
		flex-basis: calc((100% - 28px) / 2);
	}
}

@media (max-width: 600px) {
	.experience-grid > .experience-card {
		flex-basis: 100%;
	}
}

.experiences {
	padding-bottom: calc(var(--section-space) * 0.6);
}

.experience-more-ways {
	padding-top: calc(var(--section-space) * 0.6);
}

.experience-more-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.experience-more-grid > .service-card {
	flex: 0 1 calc((100% - 3 * 24px) / 4);
	min-width: 0;
}

@media (max-width: 1100px) {
	.experience-more-grid > .service-card {
		flex-basis: calc((100% - 24px) / 2);
	}
}

@media (max-width: 600px) {
	.experience-more-grid > .service-card {
		flex-basis: 100%;
	}
}

.experience-more-grid .service-card.is-active {
	border-color: var(--color-gold);
}

/* Date of birth as day / month / year boxes (Traveler Information form). */
.experience-dob {
	display: grid;
	grid-template-columns: 0.8fr 1.6fr 1fr;
	gap: 8px;
}

.experience-dob select {
	width: 100%;
}

/* Holiday page: highlights on the package cards, the contact line. */
.package-hub-tier-label {
	margin: 14px 0 6px;
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-gold);
}

.package-hub-tier-highlights {
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.package-hub-tier-highlights li {
	position: relative;
	padding-left: 16px;
	font-size: 15px;
	line-height: 1.7;
}

.package-hub-tier-highlights li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.72em;
	width: 6px;
	height: 6px;
	background: var(--color-gold);
}

.package-hub-contact {
	margin: 32px 0 0;
	text-align: center;
}

.package-hub-tiers--holiday {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 900px) {
	.package-hub-tiers--holiday {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.package-hub-tiers--holiday {
		grid-template-columns: 1fr;
	}
}

.package-hub-tier--highlight .package-hub-tier-highlights li {
	color: var(--color-white);
}

.package-hub-tier-highlights li {
	padding-left: 0;
}

.package-hub-tier-highlights li::before {
	display: none;
}

.package-hub-tier-price {
	margin: 0 0 14px;
	font-size: 14px;
}

.package-hub-tier-price strong {
	font-family: var(--font-heading);
	font-size: 24px;
	font-weight: 500;
}

.package-hub-tier-book {
	margin-top: 10px;
}

/* Payment page errors (client, 2026-11-01): always visible, in red, beside the payment fields. */
.wc-pay-form .woocommerce-error,
.wc-pay-form .woocommerce-NoticeGroup,
.wc-pay-form .wc-stripe-error,
.wc-pay-form .stripe-source-errors,
.wc-pay-form .woocommerce-invalid-required-field,
.wc-pay-form [role="alert"]:not(:empty) {
	display: block;
	margin: 0 0 16px;
	padding: 12px 16px;
	border: 1px solid #b3261e;
	border-left-width: 4px;
	background: #fdf1f0;
	color: #b3261e;
	font-size: 14px;
	list-style: none;
}

.wc-pay-form .woocommerce-error li {
	margin: 0;
	list-style: none;
}

.wc-pay-form .pay-form-errors:empty {
	display: none;
}

.wc-pay-form .StripeElement--invalid,
.wc-pay-form .wc-stripe-elements-field.invalid,
.wc-pay-form input.invalid {
	border-color: #b3261e;
}

.wc-pay-form .payment_box .error,
.wc-pay-form .payment_box .wc-stripe-error-message {
	color: #b3261e;
	font-size: 13px;
}

/* Tango Experience (client, 2026-11-01): less empty space above "Choose Your Tango Experience". */
.experience-page-content {
	padding-bottom: calc(var(--section-space) * 0.35);
}

.experience-page-content .package-hub-intro > :last-child {
	margin-bottom: 0;
}

.experience-trust-strip + .experiences {
	padding-top: calc(var(--section-space) * 0.55);
}

.experience-page-content {
	padding-bottom: 24px;
	margin-bottom: 0;
}

.experience-page-content .package-hub-intro,
.experience-page-content .package-hub-intro-row,
.experience-page-content .package-hub-intro-text {
	margin-bottom: 0;
	padding-bottom: 0;
}

.experience-page-content .wp-block-buttons,
.experience-page-content .wp-block-button {
	margin-bottom: 0;
}

/* More Ways to Experience Buenos Aires: image, description, highlights, View Full Details + Book Now (client, 2026-11-01). */
.service-card--rich {
	padding: 0 0 24px;
	overflow: hidden;
}

.service-card--rich > h3,
.service-card--rich > .service-card-text,
.service-card--rich > .service-card-highlights,
.service-card--rich > .service-card-price,
.service-card--rich > .service-card-actions {
	margin-left: 22px;
	margin-right: 22px;
}

.service-card--rich > h3 {
	margin-top: 20px;
	margin-bottom: 10px;
}

.service-card-media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.service-card-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.service-card--rich .service-card-text {
	margin-top: 0;
	font-size: 17px;
}

.service-card-highlights {
	margin-top: 0;
	margin-bottom: 16px;
	padding: 0;
	list-style: none;
	font-size: 14px;
}

.service-card-highlights li {
	display: flex;
	gap: 8px;
	margin-bottom: 6px;
}

.service-card-highlights i {
	margin-top: 4px;
	color: var(--color-gold);
	font-size: 11px;
}

.service-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: auto;
}

.experience-more-grid > .service-card--rich {
	flex-basis: calc((100% - 2 * 24px) / 3);
}

@media (max-width: 1100px) {
	.experience-more-grid > .service-card--rich {
		flex-basis: calc((100% - 24px) / 2);
	}
}

@media (max-width: 600px) {
	.experience-more-grid > .service-card--rich {
		flex-basis: 100%;
	}
}

/* Argentina Tango Group Tours (client, 2026-11-01): intro line, lead-in and button inside a checklist band. */
.checklist-band-intro,
.checklist-band-lead {
	max-width: 760px;
	margin: 0 auto 22px;
	text-align: center;
}

.checklist-band-lead {
	margin-bottom: 14px;
	font-weight: 600;
}

.checklist-band-action {
	margin: 32px 0 0;
	text-align: center;
}

.checklist-band--tinted {
	background: var(--color-light-bg);
}

.group-cta .services-cta-actions {
	justify-content: center;
}

/* Spanish lessons: Number of Students as a [ - ] 1 [ + ] counter (client, 2026-11-02). */
.sb-stepper {
	display: flex;
	align-items: stretch;
	max-width: 190px;
}

.sb-stepper input {
	flex: 1;
	min-width: 0;
	text-align: center;
	-moz-appearance: textfield;
}

.sb-stepper input::-webkit-outer-spin-button,
.sb-stepper input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.sb-stepper button {
	flex: 0 0 46px;
	border: 1px solid var(--color-border);
	background: var(--color-white);
	color: var(--color-primary);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

.sb-stepper button:hover,
.sb-stepper button:focus-visible {
	background: var(--color-primary);
	color: var(--color-white);
}

/* The Tango Class card: View Full Details + Book Now, like the "More Ways" cards. */
.experience-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 8px;
}

/* Guide & Companion: what each choice costs, shown as the guest picks it. */
.sb-price-note {
	font-weight: 600;
	color: var(--color-primary);
}

.sb-breakdown {
	margin: 0 0 12px;
	padding: 0;
	list-style: none;
	font-size: 15px;
	font-weight: 400;
}

.sb-breakdown li {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 6px 0;
	border-bottom: 1px solid var(--color-border);
}

/* The band's play button: shown when the background film is not playing
   (phones and tablets that block autoplay, reduced motion, cookies not yet
   allowed). A tap starts the full film. */
.video-band-tap {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	padding: 0;
	border: 0;
	background: rgba(9, 19, 28, 0.18);
	cursor: pointer;
}

.video-band-tap:not([hidden]) {
	display: grid;
	place-items: center;
}

.video-band-tap-icon {
	display: grid;
	place-items: center;
	width: 72px;
	height: 72px;
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	background: rgba(9, 19, 28, 0.45);
	color: var(--color-white);
	font-size: 20px;
	padding-left: 3px;
	transition: background-color 0.25s ease;
}

.video-band-tap:hover .video-band-tap-icon,
.video-band-tap:focus-visible .video-band-tap-icon {
	background: var(--color-primary);
}

/* The Tango Class card keeps its option list only for the booking dialog:
   View Full Details and Book Now replace it, so [hidden] must really hide it. */
.experience-card-options[hidden] {
	display: none;
}

/* Booking forms tucked away at the bottom of the page (client, 2026-11-04):
   a bar with a Book Now button until a card button or the bar opens the form. */
.service-booking-section.is-collapsed > .contact-page {
	display: none;
}

.service-booking-reveal {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.service-booking-reveal[hidden] {
	display: none;
}

@media (max-width: 700px) {
	.service-booking-reveal {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
	}
}

.tour-item-price {
	margin: 16px 0 12px;
	font-weight: 600;
	color: var(--color-primary);
}

/* Payment options (client, 2026-11-05/06): one stacked list - Credit Card
   open on top, Apple Pay / Google Pay below, Pay Over Time and PayPal collapsed. */
.pay-options {
	display: grid;
	gap: 10px;
	margin: 0 0 20px;
}

.pay-options [hidden] {
	display: none !important;
}

.pay-option {
	border: 1px solid var(--color-border);
	background: #fff;
}

.pay-option.is-open:not(.pay-option--wallet) {
	border-color: var(--color-primary);
}

.pay-option-head {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 0;
	padding: 15px 18px;
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--color-heading);
	text-align: left;
	background: none;
	border: 0;
	cursor: pointer;
}

.pay-option-head--static {
	cursor: default;
	padding-bottom: 6px;
}

.pay-option-dot {
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	border: 1px solid #9aa4ad;
	border-radius: 50%;
}

.pay-option.is-open .pay-option-dot {
	border: 5px solid var(--color-primary);
}

.pay-option-chevron {
	margin-left: auto;
	font-size: 12px;
	color: #777;
	transition: transform 0.2s ease;
}

.pay-option.is-open .pay-option-chevron {
	transform: rotate(180deg);
}

.pay-option-body {
	padding: 0 18px 16px;
}

.pay-option .wc_payment_methods {
	margin: 0;
}

.pay-option .wc_payment_method {
	margin-bottom: 8px;
}

.pay-option .wc_payment_method:last-child {
	margin-bottom: 0;
}

.pay-option .wc_payment_method.is-solo {
	border: 0;
	padding: 0;
	margin: 0;
}

.pay-option .wc_payment_method.is-solo > input.input-radio,
.pay-option .wc_payment_method.is-solo > label {
	display: none;
}

.pay-option .wc_payment_method.is-solo .payment_box {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.pay-option--wallet #wc-stripe-express-checkout-element {
	margin-top: 4px !important;
}

#wc-stripe-express-checkout-button-separator {
	display: none !important;
}

.pay-later-note {
	margin: 0 0 4px;
	font-size: 14.5px;
	color: #555;
}

.wc-pay-form.is-later-empty .form-row {
	display: none;
}

/* Booking dialog on short or narrow screens (client, 2026-11-06): the tall
   footer (total, robot check, button, payment logos) left the scrolling body
   only a sliver, hiding the date, guest and contact fields. There the whole
   dialog scrolls as one page instead. */
@media (max-height: 900px), (max-width: 700px) {
	.experience-form {
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
	}

	.experience-dialog-body {
		flex: none;
		overflow: visible;
	}

	.experience-dialog-footer {
		flex: none;
	}
}