/*
 * Sitewide body-paragraph standard — every <p> at 16px / 21px (client
 * request 2026-07-24, to stop per-page inconsistencies where different
 * templates set 14/15/17px). !important is required to beat the existing
 * Additional-CSS `body p { line-height: 1.75 }`, which is printed after the
 * theme stylesheets, and to override the various per-template <p> sizes.
 *
 * EXCLUDES .wp-block-kadence-advancedheading: those are Kadence "advanced
 * heading" blocks that render as <p> but are eyebrows / sub-headings, each
 * with its own deliberate size (e.g. the tour-category eyebrow at 1.1rem,
 * the "Why Choose" body copy already set to 16/21 via its own rule). A
 * blanket size here would shrink every one of them. If a spot still looks
 * wrong (hero cover text, a form, card meta), it needs its own targeted
 * rule rather than removing this baseline.
 */
body p:not(.wp-block-kadence-advancedheading) {
	font-size: 16px !important;
	line-height: 21px !important;
}

/* Hide the category label shown above search-result titles (Paul Frost's
   24 Jul 2026 list, item 4). Standard posts render this as a
   .entry-taxonomies eyebrow in the search loop (e.g. "Travel Inspiration");
   tours instead leaked the category into the auto-excerpt, handled by
   te_clean_tour_search_excerpt() in functions.php. Scoped to search results
   only — the blog listing keeps its own category labels. */
body.search .entry-taxonomies {
	display: none;
}

/* Site logo */
.site-branding a.brand img {
	max-width: 335px;
}

/* Sticky header — own implementation, not Kadence's native one.
   header_sticky is "top_main" (theme_mod), which puts Kadence's
   `.kadence-sticky-header` class on the combined .site-header-upper-inner-wrap
   (top bar + main row together). BUT Kadence's own JS that toggles
   `.item-is-fixed`/`.item-is-stuck` (position:fixed) on scroll turned out to
   be unreliable across templates — confirmed live it never fires at all on
   the About Us page (content-style-unboxed), while working fine on the
   homepage/tour pages (content-style-boxed). Rather than chase an
   undocumented per-template quirk in the (unvendored) parent theme, force
   our own positioning here instead, unconditionally, on every template.

   position:sticky (tried first) doesn't work for this element: sticky only
   has room to "stick" within its own parent's box, and the header's
   immediate ancestors (#masthead etc.) are sized to exactly the header's own
   height with no extra room — so there's nowhere for it to stick, and it
   just scrolls away like a static element. position:fixed has no such
   constraint (always relative to the viewport), so use that — with #masthead
   (which stays in normal flow) given a matching min-height as a spacer, so
   pulling its child out of flow doesn't collapse the space and jump page
   content up underneath it. assets/sticky-header.js keeps --te-header-height
   synced to the fixed header's real current height (it changes between
   normal and shrunk states) — both for this spacer and for the blue tour
   sub-nav bar's own sticky offset. */
.site-header-upper-inner-wrap.kadence-sticky-header {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	z-index: 500 !important;
}

#masthead {
	min-height: var(--te-header-height, 88px);
}

.site-header-upper-inner-wrap.kadence-sticky-header.te-header-stuck {
	background-color: #fff;
}

/* Static pages — align content width with the blog single-post reading
   column (1100px). Kadence's default page template constrains content via
   the sitewide --global-content-width var (1290px), which is wider than the
   blog. Excludes About Us / Our Brochures (custom width rules already in
   their own stylesheets, updated to 1100px there), blog/experts listing
   pages (intentionally wider, matching the blog index card grid), and the
   homepage (also carries body.page as the static front page, but its
   alignfull rows — e.g. "Our Most Loved Journeys", "Travel Editions
   Experts" — are full-bleed grey/blue backdrops designed to span the full
   viewport per home.jpg, not the 1100px blog column; constraining them here
   squeezed those backgrounds into a narrow centered strip).

   This is the rule that governs every brand-new default-template page (e.g.
   Contact Us, Private Groups) — the one place to fix for sitewide
   consistency going forward. max-width was 1100px WITH this same 24px/24px
   padding also applied on top under Kadence's border-box convention,
   shrinking true content to 1052px instead of the intended 1100px — the
   classic "box width ≠ content width once padding is added" bug documented
   throughout site_content_width_standardization memory. Bumped to 1148px
   (1100 + 2×24px) so the true rendered content is exactly 1100px, matching
   blog/tour/newsletter everywhere else. Confirmed live on Mobility
   Information (which turned out to be using the about-us-page.css version
   of this identical bug, fixed alongside this one) and re-verified this
   didn't need touching on Contact Us/Private Groups since they have no
   width override of their own and inherit straight from this rule. */
body.page:not(.home):not(.te-about-us-page):not(.te-brochures-page):not(.te-blog-page) .content-container.site-container {
	max-width: 1148px;
	padding-left: var(--global-content-edge-padding, 1.5rem);
	padding-right: var(--global-content-edge-padding, 1.5rem);
}

/* Homepage rows — most homepage sections have no width CSS of their own at
   all; they're just inheriting Kadence's default --global-content-width
   (1290px) minus its own 24px side padding, rendering at ~1242px content
   width. Bringing this down to the 1100px sitewide standard (1148px here,
   matching the same content+padding pattern used everywhere else). This is
   deliberately NOT scoped with :not(.home) exclusions like the very first
   rule in this file — it's the opposite case, home-only by design.
   Critically, this only targets the INNER content column, never the outer
   alignfull/kt-row-has-bg wrapper that paints each row's full-bleed
   background (see the 2026-07-09 incident note on the rule above for why
   that distinction matters so much on this exact page).

   Two columns must be excluded via :not(), rather than relying on a more
   specific override rule elsewhere, because this selector caps ANY
   .kt-inside-inner-col one level above the wp-block-kadence-column — and
   the hero's own containing column (kadence-column6_a5a8ef-c2) is exactly
   that shape. A hero-specific rule further down this file already
   protects the hero's own descendants (.cb-hero-slider ... .kt-row-column-wrap
   etc.) at higher specificity, but it doesn't reach this ANCESTOR column
   one level further up — capping it to 1148px silently shrank the
   containing block Kadence's alignfull JS measures from, producing a
   fixed -66px breakout margin instead of a viewport-relative one, which
   overflowed the hero off the left edge of the page. Confirmed live via
   getBoundingClientRect(): .cb-hero-slider was rendering at x=-66,
   width=1280 in a 1280px viewport (cut off on the left, short on the
   right) until this column was excluded.

   The "Browse By Interest" card carousel (kadence-column6_e9d238-fc) is
   ALSO exempted here, via :not() — per home.jpg, this carousel is meant
   to be genuinely full viewport width (cards bleed off both edges), not
   capped to the 1100px content column like the heading/text above it.
   This was wrongly capped in an earlier pass; see the note below. */
.home .kb-row-layout-wrap .kt-row-column-wrap,
.home .wp-block-kadence-column:not(.kadence-column6_e9d238-fc):not(.kadence-column6_a5a8ef-c2) > .kt-inside-inner-col {
	max-width: 1148px;
}

/* "Browse By Interest" section — the blue "Travel For The Discerning" text
   row (kb-row-layout-id6_06294e-6a) and the card carousel immediately
   below it (kadence-column6_e9d238-fc) are actually two separate sibling
   elements, not one row — the carousel column has always had a fully
   transparent background of its own. Confirmed against home.jpg: the
   carousel is meant to be full viewport width (cards bleed off both
   edges), unlike the heading/text row above it, which stays in the normal
   1100px content column — so this column is explicitly excluded from the
   general homepage width cap above, rather than narrowed to match. It
   still needs its own background color, though, since it's transparent
   by default and the design's blue band must continue seamlessly behind
   it regardless of exactly how the cards tile: #c0d2e0, matching
   .te-newsletter-signup and .te-blog-brochures elsewhere. */
.home .kadence-column6_e9d238-fc {
	background-color: #c0d2e0;
}

/* The carousel excludes ITSELF from the general 1148px cap above via
   :not(.kadence-column6_e9d238-fc), but the actual swiper track lives two
   levels deeper, inside a nested row+column (kb-row-layout-id6_b1ab2e-68 >
   kadence-column6_acd47d-79) that the general selector still matches on
   BOTH of its target shapes — `.kb-row-layout-wrap .kt-row-column-wrap`
   (no exclusion at all on that selector) AND `.wp-block-kadence-column >
   .kt-inside-inner-col` (only the outer carousel column itself is
   excluded, not this nested one). Confirmed live via
   getBoundingClientRect(): the outer carousel column rendered at full
   1280px, but .swiper/.swiper-wrapper inside it were still capped to
   1148px because their own containing kt-row-column-wrap was capped even
   after the inner-col was fixed — a child can't exceed a capped ancestor
   regardless of its own max-width. Left a dead blue gap on the right of
   the card track instead of the cards bleeding to the edge. Overriding
   every .kt-row-column-wrap/.kt-inside-inner-col nested anywhere inside
   the carousel column fixes this regardless of how many levels of nested
   rows/columns Kadence generates for the carousel block. */
.home .kadence-column6_e9d238-fc .kt-row-column-wrap,
.home .kadence-column6_e9d238-fc .kt-inside-inner-col {
	max-width: none !important;
}

/* REVERTED per explicit user instruction — the "true alignfull" attempt
   below did not fix the reported problem (row still not full width) and
   the user asked to put this row back exactly as it was before this
   session's width work touched it, rather than keep debugging further.
   That means undoing BOTH changes that affected this row today: this
   block's width/margin override (now removed), and excluding this row's
   own .kt-row-column-wrap/.kt-inside-inner-col from the general homepage
   1148px cap near the top of this file, so its content column also goes
   back to the original ~1242px it had before today. Do not re-apply
   either change without re-diagnosing why the alignfull attempt didn't
   work as expected — see [[site_content_width_standardization]]. */
.home .kb-row-layout-id6_06294e-6a .kt-row-column-wrap,
.home .kb-row-layout-id6_06294e-6a .kt-inside-inner-col {
	max-width: none !important;
}

/* Sitewide heading letter-spacing */
h1, h2, h3 {
	letter-spacing: 0.01em;
}

/* "Our History" (page 743) — reuses the About Us hero + ribbon pattern but
   never got the same CSS treatment, so it has two visible bugs: the hero's
   inner container is a flex item with no width:100%, so instead of
   stretching to fill the row it shrinks to fit the wrapped H1 text (~390px
   instead of the header's 1290px); and the cover's default block margin
   leaves a 32px gap before the ribbon bar below it. */
body.page-id-743 .wp-block-cover.alignfull:first-child .wp-block-cover__inner-container {
	width: 100%;
	max-width: var(--global-content-width, 1290px);
	margin: 0 auto;
}

body.page-id-743 .wp-block-cover.alignfull:first-child {
	min-height: 480px !important;
	margin-bottom: 0 !important;
}

body.page-id-743 .wp-block-cover.alignfull:first-child + .kb-row-layout-wrap.alignfull {
	margin-top: 0 !important;
}

/* "Our History" (page 743) has no dedicated stylesheet of its own — it
   duplicates the About Us page's content wholesale (same hero/ribbon/
   difference-rows/why-choose/FAQ structure, several blocks even share the
   exact same block IDs), but never got any of the typographic fixes made to
   about-us-page.css. Every size below mirrors the values already verified
   there against the source PSD (about us cleaned.psd) — there's no separate
   Our History comp, so the About Us proportions are the design reference. */

/* Hero H1 */
body.page-id-743 .wp-block-cover.alignfull:first-child h1,
body.page-id-743 .wp-block-cover.alignfull:first-child .wp-block-kadence-advancedheading {
	font-size: clamp(2.5rem, 4.2vw, 4.7rem) !important;
}

/* Ribbon text ("New 2026 Brochures Available Now") */
body.page-id-743 .kb-row-layout-wrap.alignfull h4,
body.page-id-743 .kb-row-layout-wrap.alignfull .wp-block-heading {
	font-size: 30px !important;
}

/* Section eyebrows ("Fresh Adventures for Inquisitive Travellers") */
body.page-id-743 .kb-row-layout-wrap.alignwide .wp-block-kadence-advancedheading:first-child,
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-1-columns) .wp-block-kadence-advancedheading:first-child,
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-1-columns) h6 {
	font-size: 1rem !important;
}

/* Section titles ("History of Travel Editions", "Why Choose Travel
   Editions?") — flat 57.6px, matching the homepage's equivalent major
   section H2s and the parallel fix on about-us-page.css's own "Section
   title" rule (page-id-743 carries both body.page-id-743 and
   body.te-about-us-page, so both rules apply here; kept in sync). */
body.page-id-743 .kb-row-layout-wrap.alignwide h2,
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-1-columns) h2 {
	font-size: 57.6px !important;
}

/* Section intro copy directly under those titles ("Travel Editions creates
   expert-led...", "Travel with purpose, passion..."). Only font-size was
   ever set for the headings above — the paragraph after them was never
   targeted at all, so it sat at the theme's default 1.75 line-height. */
body.page-id-743 .kb-row-layout-wrap.alignwide h2 ~ .wp-block-kadence-advancedheading,
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-1-columns) h2 ~ .wp-block-kadence-advancedheading:not(h3) {
	line-height: 1.35 !important;
}

/* Image/text row titles ("Travel Where the Journey Matters", etc.) */
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-2-columns) h3,
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-2-columns) .wp-block-kadence-advancedheading:first-child {
	font-size: clamp(1.5rem, 2.4vw, 2.5rem) !important;
}

/* Image/text row body copy — line-height 1.35 to match "about us cleaned.psd"
   leading (FontSize 32 / Leading 42 ≈ 1.31), same ratio used on About Us
   itself and the homepage/blog body copy (Our History has no stylesheet of
   its own, so these font-size-only rules never got a line-height fix). */
body.page-id-743 .kb-row-layout-wrap.alignnone:has(.kt-has-2-columns) .wp-block-kadence-advancedheading:not(:first-child) {
	font-size: 1rem !important;
	line-height: 1.35 !important;
}

/* Why-choose cards — title and icon */
body.page-id-743 .kt-has-3-columns h3 {
	font-size: clamp(1.25rem, 1.9vw, 1.6rem) !important;
}

/* Why-choose cards — body text under the title */
body.page-id-743 .kt-has-3-columns h3 ~ .wp-block-kadence-advancedheading {
	line-height: 1.35 !important;
}

body.page-id-743 .kt-has-3-columns .kb-svg-icon-wrap {
	font-size: 74px;
}

/* FAQ heading, intro copy, question, +/- icon, answer copy, button */
body.page-id-743 .wp-block-kadence-column.alignfull:has(.kt-accordion-wrap) > .kt-inside-inner-col > h2 {
	font-size: clamp(2rem, 3vw, 3rem) !important;
}

body.page-id-743 .wp-block-kadence-column.alignfull:has(.kt-accordion-wrap) .wp-block-kadence-advancedheading:not(h6):not(h2) {
	font-size: 1rem !important;
	line-height: 1.35 !important;
}

body.page-id-743 .kt-blocks-accordion-header {
	font-size: clamp(1.25rem, 1.85vw, 1.6rem) !important;
}

body.page-id-743 .kt-blocks-accordion-icon-trigger {
	font-size: 2.25rem !important;
}

body.page-id-743 .kt-accordion-panel-inner p,
body.page-id-743 .kt-accordion-panel-inner .wp-block-kadence-advancedheading {
	font-size: 1rem !important;
	line-height: 1.35 !important;
}

body.page-id-743 .wp-block-kadence-advancedbtn .kb-button,
body.page-id-743 .kb-btn {
	font-size: 19px !important;
}

.kb-row-layout-id6_06294e-6a > .kt-row-column-wrap {
	padding-top: var(--global-kb-row-default-top, var(--global-kb-spacing-sm, 2.2rem));
}

.kb-row-layout-id6_b1ab2e-68 > .kt-row-column-wrap {
	padding-bottom: var(--global-kb-row-default-bottom, var(--global-kb-spacing-sm, 3.5rem));
}

/* Homepage — section H2s ("What Our Guests Say", "Travel For The Discerning",
   etc.) render at a fixed 3rem via their Kadence block settings, but
   home.psd measures these at 116px design-px (~3.6rem live) — the same
   undersized-heading pattern already fixed on About Us/Our History/blog.
   Excludes "Our Most Loved Journeys" (kt-adv-heading6_61484f-0b) and
   "Discover Hidden Experiences" (kt-adv-heading6_2a6d3b-d8) — both already
   have deliberate, more-specific 3rem overrides elsewhere (global.css's
   "Our Most Loved Journeys" section and the category-slider inline CSS)
   with hand-tuned font-family/color/line-height, so leave those as-is
   pending an explicit decision to change them too. */
.home .kt-adv-heading6_4e7e2a-f8,
.home .kt-adv-heading6_0639c1-05,
.home .kt-adv-heading6_afde7b-53,
.home .kt-adv-heading6_b28abc-57,
.home .kt-adv-heading6_fc592a-ae {
	font-size: 3.6rem !important;
}

/* Homepage — "Learn More" / "Download Now" / "Expert Profile" content
   buttons should look identical to "Read More FAQs" on /about-us/
   (.kb-btn-global-fill reference instance), which is itself the button
   spec drawn in every PSD comp checked (home.psd, about us cleaned.psd,
   brox page.psd all sample #2e6b98 fill / FontSize 38 design-px ≈ 19px
   live) — not "View Tour" (.tour-button), which is a separate tour-listing
   component out of scope for this fix. These hash classes are one-off
   block instances that only exist on the homepage, so scoping to .home
   is just belt-and-braces. */
.home .kb-btn6_7ef7d3-d7,
.home .kb-btn6_532a3e-ff,
.home .kb-btn6_c2ab09-e0,
.home .kb-btn6_ad0c80-17,
.home .kb-btn6_1c1d12-d0,
.home .custom-post-type-experts .wp-block-button__link,
/* .kb-btncb5c11-a9 is the "Sign Up Now" submit button on a reusable
   Kadence Advanced Form block embedded on multiple pages (Home, About Us,
   ...), so it's intentionally NOT scoped to .home like the others above. */
.kb-btncb5c11-a9 {
	background-color: #2e6b98 !important;
	font-size: 19px !important;
	font-weight: 700 !important;
	line-height: normal !important;
	border-radius: 4px !important;
	padding: 8.8px 16px !important;
	text-transform: none !important;
}

/* Homepage — "Travel Editions Experts" carousel (custom-post-type-experts,
   Getwid post-carousel) — each expert's photo is a different natural size
   (portrait headshot, landscape environmental shot, etc.), so without a
   fixed crop box the three images render at wildly different heights side
   by side. home.jpg shows all three experts sharing one identical crop box
   (~663x402 design-px, ≈5:3) regardless of source image shape — reproduced
   here with a fixed aspect-ratio + object-fit: cover so any future expert
   photo (any orientation) still lines up with its neighbours. */
.home .expertimage img {
	aspect-ratio: 5 / 3;
	width: 100%;
	height: auto;
	object-fit: cover;
	display: block;
}

/* Homepage — same "Travel Editions Experts" carousel: each slide's photo/
   title/bio/button used to stack in normal block flow, so a shorter bio
   (fewer wrapped lines) left its "Expert Profile" button sitting higher
   than a neighbouring slide with a longer bio, even though Slick already
   stretches every slide in the row to equal height. Making the slide a flex
   column and pushing the button to the bottom with margin-top: auto fixes
   this regardless of bio length. */
.home .wp-block-getwid-post-carousel__slide {
	display: flex;
	flex-direction: column;
}

.home .wp-block-getwid-post-carousel__slide .wp-block-getwid-template-post-button {
	margin-top: auto;
}

/* "Featured Tours" tour-card carousel (.tours-slider-wrapper) — used on the
   homepage ("Our Most Loved Journeys", "Discover Hidden Experiences") *and*
   on expert profile pages ("Featured Expert Tours"), so this is left
   unscoped rather than tied to .home. Same bottom-alignment problem as the
   expert carousel above: a 2-line tour title pushes that card's price/
   button row down while a 1-line-title neighbour's stays higher. Slick
   already stretches .tour-slide to equal height per row; .tour-card and
   .tour-content just weren't participating in that height as flex
   containers, so .tour-footer (price + View Tour button) couldn't be
   pinned to the bottom. */
.tours-slider-wrapper .tour-slide {
	display: flex;
	flex-direction: column;
}

.tours-slider-wrapper .tour-card {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.tours-slider-wrapper .tour-content {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.tours-slider-wrapper .tour-footer {
	margin-top: auto;
}

/* Homepage — body-copy text blocks in "The Travel Edition Experience",
   "What Our Guests Say", "Travel For The Discerning", "Begin Your Journey
   With Our Brochure", and "Travel With Specialists". These paragraphs were
   inheriting the theme's sitewide default (body p, body li { line-height:
   1.75 }), noticeably looser than home.jpg's PSD leading (FontSize 32 /
   Leading 42 ≈ 1.31) — the same ratio the blog's body copy was already
   corrected to (1.35), reused here as the target. Scoped to these five
   sections' own row IDs rather than sitewide, since other homepage
   sections/pages weren't part of this pass. */
.home .kb-row-layout-id6_b45546-99 p.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_b95795-f5 p.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_06294e-6a p.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_ab5ddd-9a p.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_01a1ee-8e p.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_b95795-f5 .kt-testimonial-content,
.home .kb-row-layout-id6_01a1ee-8e .wp-block-getwid-template-post-content p {
	line-height: 1.35;
}

/* Homepage — body-copy paragraphs specifically (not the eyebrow labels
   caught by the row-wide rule above, e.g. "Established 1994", "From our
   travellers") standardized to exactly 16px / 21px, not the ~16.94-17px /
   1.35-ratio (~21.6-22.9px) values above — user wants these pixel-uniform
   sitewide, not just proportionally close. Listed individually by block ID
   rather than row-wide, since a row-wide selector here would also catch
   and shrink the eyebrows down to 16px, which is wrong (they're a
   deliberately larger label per the mobile PSB comp's own eyebrow
   target). Includes the 3 "Art & History/Escorted/Great British Heritage"
   card excerpts (same row, not covered by the row-wide rule above since
   that only matches direct .wp-block-kadence-advancedheading paragraphs,
   not these). See desktop_line_height_audit_20jul21 memory. */
.home .kt-adv-heading6_0ac690-26.wp-block-kadence-advancedheading,
.home .kt-adv-heading6_85d91d-b4.wp-block-kadence-advancedheading,
.home .kt-adv-heading6_a93c72-0e.wp-block-kadence-advancedheading,
.home .kt-adv-heading6_41c045-48.wp-block-kadence-advancedheading,
.home .kt-adv-heading6_ffb29a-aa.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_b95795-f5 .kt-testimonial-content,
.home .kt-adv-heading6_05e37d-28.wp-block-kadence-advancedheading,
.home .kt-adv-heading6_659333-9a.wp-block-kadence-advancedheading,
.home .kt-adv-heading6_d94407-af.wp-block-kadence-advancedheading,
.home .kb-row-layout-id6_01a1ee-8e .wp-block-getwid-template-post-content p {
	font-size: 16px !important;
	line-height: 21px !important;
}

/* "Travel For The Discerning" intro paragraph — this row's full-bleed blue
   background must stay untouched (standing exception, confirmed against
   home.jpg — see site_content_width_standardization memory), but the text
   itself was stretching to the row's own uncapped width (1456px at a
   1440px viewport) instead of the sitewide 1100px content column used for
   intro copy everywhere else. Capped and centered independently of the
   row's own width. */
.home .kt-adv-heading6_05e37d-28.wp-block-kadence-advancedheading {
	max-width: 1100px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Homepage — gap between the "Art & History / Escorted / Great British
   Heritage" Learn More buttons and "Our Most Loved Journeys" below.
   Values per user annotation on home-vertical-spacing.png (supersedes the
   earlier PSD-pixel-measured 76px estimate now that we have the designer's
   exact spec: 50px here + 2.5rem padding-top on the next row = 90px total).
   Scoped to this row's own ID rather than the shared kt-row-column-wrap
   class, since that class is reused by every Kadence row on every page. */
.home .kb-row-layout-id6_b45546-99 > .kt-row-column-wrap {
	padding-top: 2.5rem;
	padding-bottom: 50px;
}

/* Homepage — user annotations on home-vertical-spacing.png: 15px gap
   between each section's eyebrow label and the heading below it (currently
   0 in all cases), plus 2.5rem padding-top on each of these rows (added
   next to each row's own selector below). Kadence auto-generates its own
   per-block CSS with equal specificity to a plain class selector and loads
   after global.css, so these need the extra body.home + full class
   qualifier to reliably win the cascade (see "Established 1994" fix above
   for the same issue). */
body.home .kt-adv-heading6_e8ad9a-3e.wp-block-kadence-advancedheading,
body.home .kt-adv-heading6_d1325c-55.wp-block-kadence-advancedheading,
body.home .kt-adv-heading6_8d7d87-81.wp-block-kadence-advancedheading,
body.home .kt-adv-heading6_1be5d7-d4.wp-block-kadence-advancedheading,
body.home .kt-adv-heading6_4afbe7-e6.wp-block-kadence-advancedheading {
	padding-bottom: 15px;
}

.home .kb-row-layout-id6_c530b8-b1 > .kt-row-column-wrap {
	padding-top: 2.5rem;
}

.home .kb-row-layout-id6_b95795-f5 > .kt-row-column-wrap {
	padding-top: 2.5rem;
}

/* Homepage — "Meet Our Tour Lecturers" / "Travel With Specialists" row:
   2.5rem padding-top above (was 24px default) and 50px padding-bottom below
   the expert cards (was 24px default), per home-vertical-spacing.png. */
.home .kb-row-layout-id6_01a1ee-8e > .kt-row-column-wrap {
	padding-top: 2.5rem;
	padding-bottom: 50px;
}

/* Homepage — "Escorted Tours" / "Discover Hidden Experiences" row: 2.5rem
   padding-top above (was 24px default), per home-vertical-spacing.png. */
.home .kb-row-layout-id6_d615c9-fd > .kt-row-column-wrap {
	padding-top: 2.5rem;
}

/* Homepage — "Discover Hidden Experiences" H2 (kt-adv-heading6_2a6d3b-d8)
   was pinned to 3rem (48px) via a more-specific inline rule in
   homepage-category-slider.css (printed on wp_footer, so it loads after
   this file and wins any equal-specificity/!important tie) — see the
   "Our Most Loved Journeys"/"Discover Hidden Experiences" exclusion note
   above. home-vertical-spacing.png now explicitly asks to increase this to
   match the PSD (3.6rem, same target as every other homepage section H2 —
   116px design-px at the sitewide 0.4959 scale), plus a 25px padding-bottom
   before the tour-card carousel below it. Needs body + extra class to beat
   that inline rule's specificity. */
body.home .category-slider .wp-block-kadence-advancedheading.kt-adv-heading6_2a6d3b-d8 {
	font-size: 3.6rem !important;
	padding-bottom: 25px !important;
}

/* "Our Most Loved Journeys" / "Discover Hidden Experiences" carousels both
   set an inline --tours-slider-width:1200px (a per-instance setting from
   the tours-cards-block767 plugin) on .tours-slider-wrapper. .tours-slider-
   inner then does `width: min(var(--tours-slider-width), calc(100vw -
   116px)); margin: 0 auto;`. This 1200px was always wider than intended,
   but only became visible once the homepage content-width fix above
   correctly narrowed .tours-slider-wrapper's own container to 1100px:
   since 1200 > 1100, the inner slider now overflows its parent, and
   `margin: 0 auto` can't center an over-wide box — the browser resolves
   auto margins to 0 in that case, so the whole slider (and its arrows,
   which are positioned relative to it) hangs off to the right by the
   100px difference instead of staying centered. Capping max-width to 100%
   lets it fill the parent gracefully instead of overflowing. */
.tours-slider-inner {
	max-width: 100%;
}

/* "Our Most Loved Journeys" / "Discover Hidden Experiences" tour-carousel
   arrows (.tours-arrow, from the parent Kadence theme's style.css — 42px at
   this breakpoint) should match "Travel With Specialists" carousel arrows
   (.slick-arrow, 57px). Not scoped to .home: .tours-arrow is a generic
   component class that could appear on any page using this tour-carousel
   pattern, and the user asked for this applied globally. */
.tours-arrow {
	width: 57px !important;
	height: 57px !important;
}

/* Line up .tours-arrow horizontally with the "Travel With Specialists"
   .slick-arrow pair, per explicit user request. Both carousel containers
   are centered on the same viewport, but at different widths — the plugin's
   default `left/right: -46px` (tours-cards-block767/assets/style.css) put
   these arrows 21px further IN than the specialists carousel's arrows
   (measured live: tours-arrow at x=44/right=1236 in a 1280px viewport vs.
   slick-arrow at x=23/right=1257). Since .tours-slider-wrapper is 1100px
   wide (vs. the specialists carousel's ~1052px alignwide container) but
   both share the same center, offsetting -67px from THIS wrapper's own
   edges (instead of the plugin's -46px) lands the arrows at the identical
   x-position as the specialists carousel's arrows: 90 (wrapper x) - 67 = 23,
   matching slick-prev's x=23 exactly; same logic mirrored on the right. */
.tours-arrow.prev {
	left: -67px !important;
}

.tours-arrow.next {
	right: -67px !important;
}

.tours-arrow::before {
	font-size: 43px !important;
}

/* Generic fallback for the four "What Our Guests Say" stat numbers
   (52,000+ / 4.8 / 169+ / 72%) pattern — h4.wp-block-kadence-advancedheading
   — on any page that doesn't already have a more specific override. The
   home page instance is actually controlled by a pre-existing, more
   specific rule (.kb-row-layout-id6_e09c0c-a5 h4.wp-block-kadence-advancedheading,
   below) which has been updated to the same 3.75rem value; this rule is
   the sitewide safety net per explicit instruction to apply globally. */
h4.wp-block-kadence-advancedheading {
	font-size: 3.75rem !important;
}

/* Homepage — gap between the "Travel For The Discerning" / "Browse By
   Interest" blue panel box and "2027 Brochures Now Available" below was
   only 24px (the next row's default top padding). home.psd measures ~88px
   between the blue box's bottom edge and the "2026 BROCHURES NOW AVAILABLE"
   label at the sitewide 0.4959 scale — ~44px live. Uses margin-bottom
   (not padding-bottom) so the added space is neutral white gap after the
   blue box, not more blue — padding here would extend the column's own
   background color downward instead of creating a gap after it. */
.home .kadence-column6_e9d238-fc {
	margin-bottom: 20px;
}

/* Homepage — "Browse By Interest" carousel panel links (see
   te_add_interest_panel_category_links in functions.php). Anchor wraps the
   whole slide, so it needs to fill it without adding its own box model. */
.te-interest-panel-link {
	display: block;
	height: 100%;
	text-decoration: none;
}

/* Homepage — "Browse By Interest" panel hover: fade the photo slightly,
   leave the title/tour-count text (in .wp-block-cover__inner-container)
   at full opacity so only the image dims. */
.te-interest-panel-link .wp-block-cover__image-background {
	transition: opacity 0.25s ease;
}

.te-interest-panel-link:hover .wp-block-cover__image-background {
	opacity: 0.9;
}

/* Homepage — "Browse By Interest" carousel panel image height. Scoped to
   .home + :not(.cb-hero-slider) so it doesn't affect the hero carousel or
   any other page's use of the same cb/carousel-v2 block. */
.home .wp-block-cb-carousel-v2:not(.cb-hero-slider) .wp-block-cover {
	min-height: 340px;
}


/* Cover blocks — default min height */
.wp-block-cover,
.wp-block-cover-image {
	min-height: 625px;
}

/* Homepage — all h2 headings */
.home h2,
.home h2.wp-block-kadence-advancedheading {
	font-weight: 400 !important;
}

/* Homepage — "What Our Guests Say" testimonial rating stars. Reverted back
   to Kadence's native Font Awesome star icon (the custom redrawn star was
   tried and rejected). Recoloured via `color` since the SVG fill is
   currentColor. */
.home .kt-testimonial-rating-wrap .kt-svg-testimonial-rating-icon {
	width: 31px !important;
	height: 28px !important;
	color: #e9b73e;
	margin-right: 10px;
}

.home .kt-testimonial-rating-wrap .kt-svg-testimonial-rating-icon svg {
	width: 31px !important;
	height: 28px !important;
}

/* Homepage — testimonial name/occupation are plain <div>s, which Kadence's
   global body-font rule (body div, etc.) forces to Roboto with !important. */
.home .kt-testimonial-name,
.home .kt-testimonial-occupation-wrap,
.home .kt-testimonial-occupation-wrap .kt-testimonial-occupation {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
}

.home .kt-testimonial-name {
	font-weight: 600;
	font-size: 22px;
}

.home .kt-testimonial-occupation-wrap .kt-testimonial-occupation {
	font-size: 20px;
}

/* Homepage — stats row beneath testimonials. The divider between the
   testimonial cards and the stat numbers currently has zero margin either
   side, so everything butts up against everything else; the design shows
   clear whitespace above and below it. */
.home .kt-block-spacer-6_bd99d1-b5 {
	margin-top: 0px;
	margin-bottom: 30px;
}

.wp-block-kadence-testimonials .kt-blocks-carousel {
	padding-bottom: 20px;
}

/* Home hero — lead panel typography + position */

/* WP core's auto-generated "constrained layout" CSS for the Cover block
   (.wp-container-core-cover-is-layout-* > .alignfull { margin-left: calc(0px * -1); })
   zeroes only margin-left on this alignfull row, while margin-right keeps the
   normal alignfull breakout value from the theme — causing the row (and the
   hero H2s inside it) to overflow the right edge of the viewport at every
   width. Restore the matching negative margin-left so the breakout is
   symmetric again. */
.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg.alignfull {
	margin-left: calc(50% - var(--global-vw, 100vw) / 2) !important;
}

/* The 3 hero slides have different amounts of heading/subtitle text, so
   each one's cover naturally content-sizes to a different height — the
   shorter slide leaves a white gap below it (between the image and the
   next section) since the swiper container itself sizes to the tallest
   slide. home-hero-slider-height-fix.js measures all 3 slides and applies
   the tallest one's height to `.swiper-slide` via inline style on
   load/resize; this rule makes each slide's cover fill that height once
   it's set (percentage height can't resolve here otherwise, since the
   swiper wrapper's own height is itself content-derived/auto, not an
   explicit value — a real CSS limitation, not a bug). */
.home .cb-hero-slider .wp-block-cover {
	height: 100% !important;
}

/* This row's own .kt-row-column-wrap (an ancestor of .kt-inside-inner-col
   below) was getting caught by the general "homepage rows -> 1148px"
   rule further up this file, which silently capped the hero's available
   width to 1148px even though .kt-inside-inner-col's own max-width:1290px
   still computed correctly — a child can never render wider than its
   containing block regardless of its own max-width. Restoring 1290px here
   too so the whole chain stays at the hero's intended width end-to-end.

   Missing `margin-left/right: auto` here left this box flush against the
   left edge of its full-bleed alignfull parent instead of centered —
   .kt-inside-inner-col's own auto-margins below are a no-op once its
   direct parent is already clamped to the exact same 1290px, so the real
   centering has to happen at this level. This is why the hero heading and
   paragraph ran past the header logo on the left (and fell short of the
   search icon on the right) instead of matching the header's width
   exactly, per the client's annotated screenshot. */
.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg > .kt-row-column-wrap {
	max-width: 1290px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* The row above is now a true full-bleed alignfull (background only) — restore
   a readable, centered content column for the actual text, matching the same
   max-width/gutter convention already used by .wp-block-cover__inner-container
   sitewide, so the hero H2s get a real inset on both sides at every viewport
   width instead of inheriting one by accident from the margin bug above.

   padding-left/right removed 2026-07-21: this element's parent
   (.kt-row-column-wrap, the rule above this one) already got its own
   max-width:1290px + margin:auto + 24px padding added on the same day —
   stacking this element's OWN 24px padding on top of that pushed the
   heading/paragraph 24px past the header logo again (double-padding bug,
   same pattern as newsletter_block_width_fix/at_a_glance_grid_fix
   memories). max-width/margin here are now a no-op (this element is
   already exactly as wide as its already-1290px parent) but left in place
   as harmless/documented rather than deleted. */
.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg .kt-inside-inner-col {
	max-width: 1290px !important;
	/* Was margin-left/right: auto — this element is a flex item (its
	   parent .wp-block-kadence-column is display:flex), so with the
	   padding above removed, auto margins started behaving as flex
	   auto-margins (absorbing the now-freed 24px on each side as
	   centering space within the flex row) instead of doing nothing —
	   reintroducing the same misalignment from a new direction. width:100%
	   makes it fill the column outright instead of leaving any space for
	   auto margins to distribute. */
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box !important;
}

.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg > .kt-row-column-wrap {
	padding-top: 0.5% !important;
}

.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg .kt-inside-inner-col > h2.wp-block-kadence-advancedheading:first-child {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 4.7rem !important;
	font-weight: 700 !important;
	line-height: 1.05 !important;
	margin: 20px 0 !important;
}

.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg .kt-inside-inner-col > h2.wp-block-kadence-advancedheading:last-child {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 2.1rem !important;
	font-weight: 400 !important;
	line-height: 1.2 !important;
	padding-bottom: 5rem !important;
	margin: 0 !important;
	max-width: 1200px !important;
	text-transform: none !important;
}

@media (max-width: 767px) {
	.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg > .kt-row-column-wrap {
		padding-top: 0 !important;
	}

	.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg .kt-inside-inner-col > h2.wp-block-kadence-advancedheading:first-child {
		font-size: 2.35rem !important;
	}

	.home .cb-hero-slider .wp-block-cover__inner-container > .kb-row-layout-wrap.kt-row-has-bg .kt-inside-inner-col > h2.wp-block-kadence-advancedheading:last-child {
		font-size: 1.4rem !important;
		padding-bottom: 2rem !important;
	}
}

/* Homepage search widget — above hero content, below header mega menu */
.home .tswb-search__button {
	background: #2e6b98;
}

.home .tswb-search__button:hover,
.home .tswb-search__button:focus-visible {
	background: #265a82;
}

.home .tswb-search__departure-month.is-range-start,
.home .tswb-search__departure-month.is-range-end,
.post-type-archive-tours .tswb-search__departure-month.is-range-start,
.post-type-archive-tours .tswb-search__departure-month.is-range-end {
	background: radial-gradient(circle at center, #2e6b98 0 29px, transparent 30px), #e9eaec;
	color: #fff;
}

.home .tswb-search__departure-month.is-selected.is-range-start.is-range-end:not(.is-in-range),
.post-type-archive-tours .tswb-search__departure-month.is-selected.is-range-start.is-range-end:not(.is-in-range) {
	background: #2e6b98;
	color: #fff;
}

.wp-block-tswb-tour-search-widget,
.wp-block-tswb-tour-search-widget .tswb-search {
	z-index: 40 !important;
}

.tswb-search__departure-panel,
.tswb-search__interest-panel,
.tswb-search__destination-panel,
.te-filter-panel {
	z-index: 500 !important;
}

/* Secondary nav — keep above overlapping page layers */
.kadence-column934_d5a10e-19 > .kt-inside-inner-col {
	position: relative;
	z-index: 10;
}
.wp-block-kadence-navigation  {
	z-index: 10 !important;
}

:where(.kb-row-layout-wrap:has(.wp-block-kadence-navigation)) {
	z-index: 10 !important;
}

#search-sidebar-overlay {
	z-index: 10100 !important;
}

#search-sidebar {
	z-index: 10101 !important;
}

/* =========================================
   Site header — utility bar + primary nav
   (desktop only; mega menu rules untouched)
========================================= */
@media (min-width: 1025px) {
	.site-main-header-wrap .site-main-header-inner-wrap {
		min-height: 88px !important;
	}

	.site-main-header-wrap .site-header-row-container-inner {
		padding-top: 12px !important;
		padding-bottom: 12px !important;
	}

	.main-navigation .primary-menu-container > ul > li.menu-item > a {
		padding-top: 0.9em !important;
		padding-bottom: 0.9em !important;
	}

	#primary-menu > .menu-item-955 > a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	/* Sticky header — shrink the main row once stuck.
	   .te-header-stuck is our own class (assets/sticky-header.js), not
	   Kadence's — see the .site-header-upper-inner-wrap comment above for
	   why. Only applies once actually scrolled past the header's natural
	   position, not at rest. */
	.site-header-upper-inner-wrap.te-header-stuck .site-main-header-wrap .site-main-header-inner-wrap {
		min-height: 56px !important;
	}

	.site-header-upper-inner-wrap.te-header-stuck .site-main-header-wrap .site-header-row-container-inner {
		padding-top: 6px !important;
		padding-bottom: 6px !important;
	}

	.site-header-upper-inner-wrap.te-header-stuck .site-branding a.brand img {
		/* No transition — sticky-header.js measures the header's real height
		   synchronously right when .te-header-stuck is toggled, for both the
		   #masthead spacer and the tour sub-nav's offset. A CSS transition
		   here would make that first measurement land mid-animation. */
		max-width: 220px !important;
	}

	#primary-menu > .menu-item-955 .te-nav-search-icon {
		display: block;
		width: auto;
		height: 22px;
	}
}

/* =========================================
   Headline sections — site-wide
========================================= */

/* Main headline */
.wp-block-kadence-column.alignfull .kt-inside-inner-col > h1.wp-block-kadence-advancedheading,
.wp-block-kadence-column.side-lines .kt-inside-inner-col > h1.wp-block-kadence-advancedheading,
.entry-content .kb-row-layout-wrap .wp-block-kadence-advancedheading:first-child:is(h1, h2),
.single-content .kb-row-layout-wrap .wp-block-kadence-advancedheading:first-child:is(h1, h2) {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-weight: 400 !important;
	font-style: normal !important;
}

/* Subhead — smaller, slightly heavier */
.wp-block-kadence-column.alignfull .kt-inside-inner-col > h1.wp-block-kadence-advancedheading + .wp-block-kadence-advancedheading,
.wp-block-kadence-column.side-lines .kt-inside-inner-col > h1.wp-block-kadence-advancedheading + .wp-block-kadence-advancedheading,
.entry-content .kb-row-layout-wrap .wp-block-kadence-advancedheading:first-child:is(h1, h2) + .wp-block-kadence-advancedheading,
.single-content .kb-row-layout-wrap .wp-block-kadence-advancedheading:first-child:is(h1, h2) + .wp-block-kadence-advancedheading {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 1.1rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* =========================================
   Homepage — tour category cover subtitles
========================================= */

.home .kt-adv-heading6_8516d2-96,
.home .kt-adv-heading6_963eb1-08,
.home .kt-adv-heading6_a3e120-79 {
	font-size: 28px !important;
}

/* =========================================
   Our Most Loved Journeys — section headings
========================================= */

.home .kadence-column6_448288-7c .kt-adv-heading6_d1325c-55 {
	font-family: "Roboto", sans-serif !important;
	font-size: 1.1rem !important;
	font-weight: 400 !important;
	line-height: 2rem !important;
	text-transform: uppercase !important;
	color: #016d9c !important;
	margin: 0 0 0 !important;
	text-align: center !important;
}

.home .kadence-column6_448288-7c .kt-adv-heading6_61484f-0b {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 3rem !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.1 !important;
	text-transform: capitalize !important;
	color: var(--global-palette3, #1a1a1a) !important;
	margin: 0 !important;
	text-align: center !important;
}

/* =========================================
   Newsletter row — shared template styling
   =========================================
   "Sign Up To Our Newsletter" (wp_block post 2802, "Newsletter 1") is a
   WordPress reusable block embedded via <!-- wp:block {"ref":2802} /--> on
   ~165 pages: the homepage, About Us + its 4 sub-pages, and ~160 tour
   pages. Its content (and therefore its hash classes, prefixed
   "6_..." after the homepage's copy was made canonical) is identical
   everywhere it's used, so one unscoped rule set here styles every
   instance — no more per-page CSS files each carrying their own copy. */
.kt-adv-heading6_7baf6d-bc {
	font-family: "Roboto", sans-serif !important;
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	font-style: normal !important;
	line-height: 1.4 !important;
	text-transform: uppercase !important;
	letter-spacing: normal !important;
	color: #2e6b98 !important;
	margin: 0 0 0.55rem !important;
}

.kt-adv-heading6_26ffc6-43 {
	font-size: 3.6rem !important;
	font-weight: 400 !important;
	line-height: 1.1 !important;
	text-transform: capitalize !important;
	letter-spacing: 0.02em !important;
	color: #1a202c !important;
	margin: 0 0 1.8rem !important;
}

.kt-adv-heading6_a30e93-f8 {
	/* Was 16.96px — user reported paragraph sizes drifting around 16.9px
	   sitewide and asked for exactly 16px, matching the other body-copy
	   paragraphs already at that size. */
	font-size: 16px !important;
	/* Was 1.75, inherited from the theme's sitewide "body p, body li"
	   default and never overridden here — looser than the ~1.31-1.35
	   PSD-measured target used for body copy everywhere else on the
	   site (see desktop_line_height_audit_20jul21 memory). */
	/* Explicit 21px, not a ratio — see desktop_line_height_audit_20jul21. */
	line-height: 21px !important;
	letter-spacing: 0.16px !important;
	color: #1a202c !important;
	margin: 0 0 2rem !important;
}

.kb-row-layout-id6_0a53f7-f9 > .kt-row-column-wrap {
	padding-top: 2.5rem;
}

/* The block's own saved padding uses var(--global-kb-spacing-lg/-sm, ...)
   with a rem fallback, but those custom properties are currently emitting
   empty (not just "unset" — actually empty-string) sitewide, which makes
   the var() resolve to nothing rather than falling through to its
   fallback, collapsing the photo's inset to 0. Hardcoding the px values
   here keeps the image inset correct independent of that unrelated
   sitewide custom-property issue. Right padding removed per explicit
   request — the image should sit flush against the row's own right edge. */
.kb-image6_9aa55d-fe:not(.kb-image-is-ratio-size) .kb-img {
	padding-left: 48px !important;
	padding-right: 0 !important;
}

/* The photo's own aspect ratio (438x601 natural) only fills ~601px, but
   the text column next to it varies in height per page (taller on About
   Us/tour pages than it happened to be on the homepage where this was
   originally built), leaving a gap under the image and the row colliding
   with whatever comes next. Stretch the image to match the text column's
   full height instead of its own intrinsic aspect ratio, cropping via
   object-fit so the photo doesn't distort. */
.kb-row-layout-id6_0a53f7-f9 .kadence-column6_5f5b88-8f > .kt-inside-inner-col {
	height: 100%;
}

.kb-row-layout-id6_0a53f7-f9 .kb-image6_9aa55d-fe {
	height: 100%;
}

.kb-row-layout-id6_0a53f7-f9 .kb-image6_9aa55d-fe .kb-img {
	height: 100% !important;
	width: 100%;
	object-fit: cover;
}

/* Several page-specific stylesheets (about-us-page.css, this file's
   body.page-id-743 block above, and the single-tours body-copy rule
   below) apply broad catch-all selectors — "any heading/paragraph inside
   an alignwide row", "any advanced-heading in a 2-column row" — that were
   written before this block existed anywhere but the homepage and end up
   matching it by accident. They're all !important with higher specificity
   than a plain class selector, so this repeats each one's exact selector
   chain, scoped down to just the newsletter row, to reliably win. */
body.te-about-us-page .entry-content.single-content > .kb-row-layout-wrap.alignwide.kb-row-layout-id6_0a53f7-f9 .wp-block-kadence-advancedheading.kt-adv-heading6_7baf6d-bc:first-child,
body.page-id-743 .kb-row-layout-wrap.alignwide.kb-row-layout-id6_0a53f7-f9 .wp-block-kadence-advancedheading.kt-adv-heading6_7baf6d-bc:first-child {
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	text-transform: uppercase !important;
	letter-spacing: normal !important;
	color: #2e6b98 !important;
	margin: 0 0 0.55rem !important;
}

body.te-about-us-page .entry-content.single-content > .kb-row-layout-wrap.alignwide.kb-row-layout-id6_0a53f7-f9 h2.kt-adv-heading6_26ffc6-43,
body.page-id-743 .kb-row-layout-wrap.alignwide.kb-row-layout-id6_0a53f7-f9 h2.kt-adv-heading6_26ffc6-43 {
	font-size: 3.6rem !important;
	font-weight: 400 !important;
	line-height: 1.1 !important;
	text-transform: capitalize !important;
	letter-spacing: 0.02em !important;
	color: #1a202c !important;
	margin: 0 0 1.8rem !important;
}

body.te-about-us-page .entry-content.single-content > .kb-row-layout-wrap.alignwide.kb-row-layout-id6_0a53f7-f9 h2 ~ .wp-block-kadence-advancedheading.kt-adv-heading6_a30e93-f8,
body.page-id-743 .kb-row-layout-wrap.alignwide.kb-row-layout-id6_0a53f7-f9 h2 ~ .wp-block-kadence-advancedheading.kt-adv-heading6_a30e93-f8,
body.single-tours .kb-row-layout-id6_0a53f7-f9 p.kt-adv-heading6_a30e93-f8.wp-block-kadence-advancedheading {
	font-size: 16px !important;
	/* Explicit 21px, not a ratio — see desktop_line_height_audit_20jul21. */
	line-height: 21px !important;
	letter-spacing: 0.16px !important;
	color: #1a202c !important;
	margin: 0 0 2rem !important;
}

/* =========================================
   Our Most Loved Journeys — tour slider cards
   (scoped; loads after Customizer CSS)
========================================= */

.home .kb-row-layout-wrap:not(.category-slider) .tours-slider-wrapper .tour-badge {
	font-family: "Roboto", sans-serif !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
}

.tours-slider-wrapper .tour-badge-discover {
	font-family: "Roboto", sans-serif !important;
	font-size: 9px !important;
	font-weight: 600 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	width: max-content !important;
	max-width: calc(100% - 24px) !important;
	display: inline-block !important;
	white-space: nowrap !important;
}

.tours-slider-wrapper .tour-image-wrap .tour-duration {
	position: absolute !important;
	display: block !important;
	bottom: 16px !important;
	left: 12px !important;
	color: #fff !important;
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 2rem !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.1 !important;
	text-transform: none !important;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45) !important;
}

.tours-slider-wrapper h2.tour-title,
.home .tours-slider-wrapper h2.tour-title {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 1.65rem !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.2 !important;
	padding: 0 !important;
}

.tours-slider-wrapper .tour-departure {
	font-family: "Roboto", sans-serif !important;
	font-size: 1rem !important;
	font-weight: 400 !important;
	color: #666 !important;
	line-height: 1.4 !important;
}

.tours-slider-wrapper .tour-price-label {
	font-family: "Roboto", sans-serif !important;
	font-size: 0.75rem !important;
	font-weight: 400 !important;
	color: #666 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
}

.tours-slider-wrapper .tour-price,
.tours-slider-wrapper .tour-price-discover {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 1.75rem !important;
	font-weight: 400 !important;
	line-height: 1 !important;
}

/* Carousel price colours (client 2026-07-24), applied sitewide by carousel
   type via the plugin's price class: the plain "tours-slider" carousels
   (e.g. "Our Most Loved Journeys") use blue #2e6b98; the "by category"
   /"discover" carousels (e.g. "Discover Hidden Experiences") render an extra
   .tour-price-discover class and use orange #bb6613. The compound selector
   outranks the blue rule above, so the orange wins wherever it applies. */
.tours-slider-wrapper .tour-price {
	color: #2e6b98 !important;
}

.tours-slider-wrapper .tour-price.tour-price-discover {
	color: #bb6613 !important;
}

.tours-slider-wrapper a.tour-button {
	font-family: "Roboto", sans-serif !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
}

/* Travel With Specialists — carousel content was rendering at 1052px, not
   the 1100px sitewide standard, because this carousel's row
   (kb-row-layout-id6_774d49-d1) is NESTED one level inside the section's
   already-1100px-wide content column, but its own .kt-row-column-wrap still
   carries Kadence's default 24px side padding meant for a top-level row —
   the same double-padding pattern already fixed once on the blog page (see
   site_content_width_standardization memory). That extra 24px each side
   squeezed the carousel's available width to 1052px. Removing this row's
   own padding lets it fill the full 1100px already reserved by its parent,
   without moving the row's own outer box (only the inset within it changes,
   confirmed via getBoundingClientRect on the ancestor chain). */
.home .kb-row-layout-id6_774d49-d1 > .kt-row-column-wrap {
	padding-left: 0;
	padding-right: 0;
}

/* Travel With Specialists — expert carousel arrows. home.jpg shows these
   circles at ~116 design-px diameter, pushed well clear of the card images
   (~65 design-px gap) — both bigger and further outward than the previous
   38px/-46px values here, measured by pixel-scanning the flattened jpg for
   the circle's white-to-grey edges (matching the technique already used
   for the About Us spacing passes; see psd-comparison-methodology memory).

   Offset changed from -91px to -67px (2026-07-21) to compensate for the
   width fix above: removing the row's 24px side padding widens the
   carousel's offsetParent (.wp-block-getwid-post-carousel__wrapper) by 24px
   on each side, which would otherwise drag these absolutely-positioned
   arrows 24px further out along with it. Reducing the offset by exactly
   24px keeps the arrows at their original, already-aligned absolute page
   position (verified live: unchanged at x=103/1280 in a 1440px viewport,
   matching pre-fix measurements) — required so they stay in line with the
   "Our Most Loved Journeys"/"Discover Hidden Experiences" carousel arrows
   aligned to them in yesterday's session. */
.custom-post-type-experts .slick-prev,
.custom-post-type-experts .slick-next {
	top: 34% !important;
	transform: translateY(-50%) !important;
	width: 57px !important;
	height: 57px !important;
	padding: 0 !important;
	line-height: 0 !important;
}

.custom-post-type-experts .slick-prev {
	left: -67px !important;
}

.custom-post-type-experts .slick-next {
	right: -67px !important;
}

.custom-post-type-experts .slick-prev:before,
.custom-post-type-experts .slick-next:before {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	display: block !important;
	width: auto !important;
	height: auto !important;
	font-family: inherit !important;
	font-size: 43px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: #111 !important;
	opacity: 1 !important;
}

.custom-post-type-experts .slick-prev:before {
	content: "<" !important;
}

.custom-post-type-experts .slick-next:before {
	content: ">" !important;
}

/* Travel For The Discerning — image block typography */
.kadence-column6_e9d238-fc .wp-block-cover__inner-container > h2.wp-block-kadence-advancedheading:first-child,
.discerning-travel-block .wp-block-cover__inner-container > h2.wp-block-kadence-advancedheading:first-child {
	font-family: "Roboto", sans-serif !important;
	font-size: 0.8rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	line-height: 1.2 !important;
	margin-bottom: 0.35rem !important;
}

.kadence-column6_e9d238-fc .wp-block-cover__inner-container > h2.wp-block-kadence-advancedheading:last-child,
.discerning-travel-block .wp-block-cover__inner-container > h2.wp-block-kadence-advancedheading:last-child {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 1.75rem !important;
	font-weight: 400 !important;
	line-height: 1.15 !important;
}

.discerning-travel-block .wp-block-cover__inner-container > h2.wp-block-kadence-advancedheading:last-child {
	font-size: 2rem !important;
}

/* What Our Guests Say — stat numbers */
.kb-row-layout-id6_e09c0c-a5 h4.wp-block-kadence-advancedheading {
	font-family: minion-pro, "Minion Pro", Georgia, serif !important;
	font-size: 3.75rem !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1 !important;
	color: var(--global-palette1) !important;
}

/* What Our Guests Say — stat row titles (e.g. "Travellers since 1994") */
.kb-row-layout-id6_e09c0c-a5 p.wp-block-kadence-advancedheading {
	font-weight: 700;
}

/* Your Itinerary — uniform LHS tab dividers */
#itinerary .kt-tabs-title-list .kt-tab-title,
#itinerary .kt-tabs-title-list li.kt-tab-title-active .kt-tab-title,
#itinerary .kt-tabs-title-list li .kt-tab-title:hover {
	border-bottom-color: #d4d4d4 !important;
	border-bottom-width: 2px !important;
}

/* Tour intro — Read More / Show Less buttons */
.single-tours .kb-show-more-buttons .kb-button.kb-btn-global-fill {
	background: #2e6b98 !important;
	border-color: #2e6b98 !important;
	color: #fff !important;
}

.single-tours .kb-show-more-buttons .kb-button.kb-btn-global-fill:hover {
	background: #1e4a7c !important;
	border-color: #1e4a7c !important;
	color: #fff !important;
}

/* Tour page — remove trailing pipe from section nav */
.single-tours .wp-block-kadence-navigation .menu > li.menu-item:last-child > .kb-link-wrap.kb-link-wrap.kb-link-wrap.kb-link-wrap {
	--kb-nav-link-border-right: 0 !important;
	border-right: 0 !important;
}

/* Tour page — remaining body-copy blocks (At A Glance cards, Itinerary day
   descriptions, Availability text) had no line-height override anywhere —
   unlike the intro/FAQ/expert-guide sections (tour-intro.css/tour-faq.css/
   tour-expert-guide.css), so they sat at the theme's 1.75 default. Same
   1.35 target, confirmed against "tour page enquiry.psd"'s measured 42px
   body-copy leading. */
body.single-tours p.wp-block-kadence-advancedheading {
	line-height: 1.35 !important;
}

/* Tour page — sticky section nav (What's Included, Itinerary, etc.).
   Sticks directly below the site header instead of scrolling behind it.
   --te-header-height is kept in sync with the header's live (possibly
   shrunk) height by tour-book-now-scroll.js. Reparented out from under the
   hero column by that same script so position:sticky isn't defeated by an
   overflow:hidden/transformed ancestor. z-index kept below the header's own
   stacking (masthead sits at z-index:100, see Kadence's transparent-header
   rule) so the header always paints above this bar, never behind it. */
body.single-tours .wp-block-kadence-column.alignfull:has(+ .te-tour-section-nav) > .kt-inside-inner-col {
	padding-bottom: 0 !important;
}

body.single-tours .te-tour-section-nav {
	position: sticky;
	top: var(--te-header-height, 96px);
	z-index: 90 !important;
	background-color: #016d9c;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding-bottom: 13px;
}

/* Bar height reduced by 6px total (3px off each side, kept even). The
   matching top space comes from Kadence's own generated CSS
   (--kb-nav-padding-top on the block's own .menu selector, both originally
   1rem via --global-kb-spacing-xs) — override it directly here rather than
   the CSS variable, since the variable is shared with other nav instances. */
body.single-tours .te-tour-section-nav ul.kb-navigation {
	padding-top: 13px !important;
}

/* Homepage search widget — above hero content, below header mega menu */
.wp-block-tswb-tour-search-widget,
.wp-block-tswb-tour-search-widget .tswb-search {
	z-index: 40 !important;
}

/* The plugin's own CSS already sets border:0/background:transparent on
   .tswb-search__control, and this is the same class shared by the
   Departure Date/Interest toggle <button>s, which correctly render as
   plain text with no visible box. But the Destination field is an
   <input type="search">, and Safari/Chrome apply their own native
   rounded search-field chrome to that element unless -webkit-appearance
   is explicitly reset too — the plugin only set the unprefixed
   `appearance: none`, which isn't sufficient for type="search" in
   WebKit. Result: Destination visually looked like a bordered input box
   while Departure Date/Interest looked like plain label+text, even
   though all three share the same base class. Force it to render
   identically to its siblings, sitewide (this widget appears on the
   homepage and every tour page, not just .home). */
input.tswb-search__control[type="search"] {
	-webkit-appearance: none;
	appearance: none;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

input.tswb-search__control[type="search"]::-webkit-search-decoration,
input.tswb-search__control[type="search"]::-webkit-search-cancel-button,
input.tswb-search__control[type="search"]::-webkit-search-results-button,
input.tswb-search__control[type="search"]::-webkit-search-results-decoration {
	display: none;
}

.tswb-search__departure-panel,
.tswb-search__interest-panel,
.tswb-search__destination-panel,
.te-filter-panel {
	z-index: 500 !important;
}

/* Fix: cb/carousel-v2 blocks collapse to 48px when inside Kadence columns with
   Content Alignment set to Centre (generates align-items:center on inner col).
   These two rules apply globally to all tour pages without per-page selectors. */
.wp-block-kadence-column:has(.wp-block-cb-carousel-v2) > .kt-inside-inner-col {
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* WP core's auto-generated per-page inline CSS ("body.single-tours
   .entry-content.single-content > .wp-block-kadence-column > .kt-inside-inner-col")
   forces 1.5rem side padding on every top-level column on tour pages —
   higher specificity than the rule above, so it was still squeezing the hero
   carousel 24px in on each side (never truly full-bleed). Match its exact
   specificity, scoped to the carousel's own column, to win. */
body.single-tours .entry-content.single-content > .wp-block-kadence-column:has(.wp-block-cb-carousel-v2) > .kt-inside-inner-col {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.wp-block-cb-carousel-v2 {
  align-self: stretch;
  width: 100%;
}

/* "Choose Your Departure" section — the light-blue background (painted on
   the .kt-inside-inner-col that wraps the heading + departures table +
   search widget together) should run full-bleed edge to edge, while the
   actual content inside stays boxed at the standard 1290px content width.

   That background-bearing inner-col sits inside its OWN row-layout wrap
   (the "outer" wrap, one level up from the departures block's own nested
   row), which needs de-boxing for the background to reach the edges. The
   departures block's row has a SEPARATE, independent kt-row-column-wrap of
   its own one level further in — leaving that one alone is what keeps its
   content properly centered at 1290px once the outer wrap goes full-bleed,
   no extra padding rule needed there.

   Selector distinguishes the outer wrap from the inner one via the
   direct-child chain: only the outer wrap's column has an alignfull
   row-layout-wrap as a *direct* child of its inner-col (the departures
   block sits directly in its own inner-col, no such intermediate row). */
body.single-tours .entry-content.single-content .kt-row-column-wrap:has(> .wp-block-kadence-column > .kt-inside-inner-col > .kb-row-layout-wrap.alignfull .tour-departures-block) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Tour page RHS panel — "Tour Grading" icon. Client supplied a custom
   footprints asset (media library) to replace the Font Awesome shoe-prints
   icon (and its CSS rotation) used previously. The icon markup itself is
   duplicated in each tour's own post_content (one per tour, not a shared
   reusable block), so a content-level swap isn't feasible sitewide — instead
   hide the original inline SVG and paint the new asset via ::before, keyed
   off the shared class name Kadence assigns for this icon selection, which
   *is* consistent across every tour page's markup.

   Uses background-image, not `content: url()` — content:url() renders a
   pseudo-element image at its native pixel size and ignores width/height
   entirely (confirmed live: rendered at the source PNG's native 70px tall
   instead of scaling to match the other 40px-wide RHS icons), so the box
   has to be sized explicitly and the image painted into it instead. */
.kb-svg-icon-fas_shoe-prints svg {
  display: none;
}

.kb-svg-icon-fas_shoe-prints::before {
  content: '';
  display: block;
  width: 40px;
  height: 40px;
  background-image: url('/wp-content/uploads/2026/07/rating.png'); /* attachment 7561 */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Tour hero — reduce height so the blue interstitial sub-nav sits above the
   fold. Height comes entirely from this cover block's own padding (6rem top
   + bottom, inline per-block, consistent across all tour pages) rather than
   a min-height, so trim the padding directly. -2rem (32px) each side =
   -64px total, within the requested 50-100px reduction. !important needed
   to beat the inline style. */
.cb-hero-slider .wp-block-cover {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

/* Fix: cb/carousel-v2 flashes/resizes on load — it paints its raw pre-JS
   markup first (bordered, uncropped image, no nav arrows), then Swiper
   initializes and swaps in its full-bleed cropped layout with arrows
   injected via JS. Hide until Swiper's own .swiper-initialized class
   appears (or our functions.php fallback timeout adds .cb-carousel-ready),
   then fade in, so the visible jump never paints. */
.wp-block-cb-carousel-v2 .swiper {
  opacity: 0;
  transition: opacity 0.25s ease;
}

.wp-block-cb-carousel-v2 .swiper.swiper-initialized,
.wp-block-cb-carousel-v2 .swiper.cb-carousel-ready {
  opacity: 1;
}

/* Breadcrumb row (tour pages) — the row's own default top spacing
   (--global-kb-row-default-top, 24px) left a visible gap between the fixed
   header and the breadcrumb, invisible only because both sit on a white
   background. Unrelated to the sticky-header positioning work (#masthead
   spacer / .te-header-stuck) — only removes this row's own padding-top so
   the breadcrumb sits flush under the header; padding-bottom (space before
   the hero) is untouched. */
.kt-row-column-wrap:has(.yoast-breadcrumbs) {
  padding-top: 0 !important;
}

/* This row (built per-post like the "At A Glance" icon list, hence the
   :has() scoping rather than a per-post ID) was also capped at the
   sitewide 1100px body-content width (1148px incl. padding) — the same
   width its own tour intro/content column uses — instead of the
   site-container/logo's 1290px, landing ~71px right of the header. Broken
   out to full viewport width and re-inset with site-container's own
   max(24px, ...) formula, same technique as the expert-page and
   Our Brochures breadcrumb fixes.

   Needs the fuller `.entry-content.single-content .kb-row-layout-wrap > `
   prefix (not just `.kt-row-column-wrap:has(...)`) to out-specificity
   tour-content-layout.css's own generic 1148px width rule for this same
   element — a shorter selector loses even with !important on both sides,
   since equal-!important ties go to specificity (more classes wins), not
   source order (see [[at_a_glance_grid_fix]] memory for the same gotcha). */
body.single-tours .entry-content.single-content .kb-row-layout-wrap > .kt-row-column-wrap:has(.yoast-breadcrumbs) {
  position: relative !important;
  left: 50% !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: -50vw !important;
  padding-left: max(24px, calc((100vw - 1290px) / 2 + 24px)) !important;
  padding-right: max(24px, calc((100vw - 1290px) / 2 + 24px)) !important;
  box-sizing: border-box !important;
}

/* Was inheriting the theme's plain body font-size (17px) — every other
   page's breadcrumb (About Us, expert single, Our Brochures) uses 1.1rem
   (17.6px); matched here for consistency. */
.yoast-breadcrumbs {
  font-size: 1.1rem;
}

/* Yoast's own "current page" segment (.breadcrumb_last, not a custom
   te-*__breadcrumb-current class since this breadcrumb is Yoast's native
   output) was inheriting a near-black theme text color (#2d3748) instead
   of the exact #333 every other page's current-page segment uses. */
.yoast-breadcrumbs .breadcrumb_last {
  color: #333;
}

/* ============================================================
   Mobile homepage corrections vs "new mobile design 17
   meganav.psb" (scale factor 0.3333, iPhone 14/15 Pro Max 3x
   frame — see mobile_psb_audit_findings memory). Findings were
   measured 10 days before this pass and re-verified live at a
   430px viewport before applying; nothing had drifted. All
   !important since these override either per-block inline
   styles Kadence's block editor generates (same specificity,
   load-order dependent) or the parent theme's core mobile-nav
   CSS.
   ============================================================ */
@media (max-width: 767px) {
  /* Hero subheading font-size (22.4px vs the mobile PSB's 24.7px
     target) is DELIBERATELY not touched here — it's controlled by
     the hero's own established sizing rule
     (.cb-hero-slider ... h2:last-child, ~line 712) and the user has
     given a standing instruction to leave the hero completely
     alone. Left as an open item in mobile_psb_audit_findings. */

  /* ── "New 2027 Brochures Available Now" ribbon ──────────────
     Paul's 24 Jul email, items b/c/e: standardise this stripe on
     mobile. It is authored separately on the homepage, on the
     tour_category pages (Element 1898) and on standalone pages
     like Our History, each with its own Kadence row ID and its own
     size — 20.8px, 16px and 30px respectively. The `.te-brochure-
     ribbon` class is added by te_link_brochure_ribbon_heading() in
     functions.php so all three can be hit at once.

     The previous rule here targeted .kb-row-layout-id6_7cbe63-e7,
     which carries kb-v-sm-hidden and so is not rendered at this
     breakpoint at all — it never took effect on a phone.

     The decorative ─── rules must go: measured at a 375px viewport
     the full string is 669px at the authored 30px and still 357px
     at 16px, against a 343px container, so it cannot fit on one
     line at any readable size while they are present (this is the
     clipped "New 2027 Brochures Av…" in Paul's screenshot).
     Without them it is 316px at 20px.

     Size targets the mobile PSB's 22.3px but is clamped, because
     22.3px only actually fits from roughly 390px of viewport up:
     the text needs ~15.8px of width per font-px against a
     (viewport − 32px) container. 5.6vw gives 21px at 375px and
     reaches the 22.3px cap by ~398px. white-space is unpinned as a
     belt-and-braces so any future copy change wraps rather than
     clipping again. */
  .te-brochure-ribbon__rule {
    display: none;
  }

  /* The repeated class is deliberate, not a typo. Two page-scoped rules
     set this h4 to 30px !important with no media query, so they apply on
     mobile too and outrank anything reasonable:

       body.page-id-743 .kb-row-layout-wrap.alignfull h4          (0,3,2)
       body.te-about-us-page .entry-content.single-content
         > .kb-row-layout-wrap.alignfull h4                       (0,5,2)  <- about-us-page.css

     Repeating the class six times gives (0,6,0), which beats (0,5,2) on
     class count without assuming any ancestor — important because this
     ribbon sits in a different container on the homepage, on the
     tour_category pages (Element 1898) and inside .entry-content on the
     standalone pages. Matching is unchanged; only weight goes up.

     NOTE: about-us-page.css also carries a max-width:767px rule setting
     this h4 to 17px, but WITHOUT !important, so it has never once applied
     — the same file's non-media !important rule always beat it. Worth
     cleaning up separately; left alone here to avoid changing About Us
     desktop as a side effect of a mobile task. */
  .te-brochure-ribbon.te-brochure-ribbon.te-brochure-ribbon.te-brochure-ribbon.te-brochure-ribbon.te-brochure-ribbon {
    font-size: clamp(18px, 5.6vw, 22.3px) !important;
    white-space: normal !important;
  }

  /* ── Eyebrow-to-heading rhythm, measured against the PSB ────
     Paul's 24 Jul email, item b: panels "need to have the margins
     and/or vertical space tweaked in line with the mobile visual".
     The margins half is handled above; this is the vertical space.

     Measured from new mobile design 17 meganav.psb by walking its type
     layers and comparing glyph extents (the comp's layer bboxes are
     glyph bounds, so the live side is measured with Range.getClientRects
     rather than getBoundingClientRect — element boxes include padding
     and would not be comparable).

       section                    comp    live   short by
       Established 1994           26.7      11       16
       Featured tours             28.7      15       14
       From our travellers        26.7      11       16
       Browse by interest         26.7      12       15
       2027 brochures             29.0      13       16
       Newsletter                 28.3       3       25

     The comp is consistent at 26.7–29px (mean 27.5); the live site
     ranges 3–15px, so every eyebrow is tight and they disagree with
     each other. Setting one padding-bottom on all seven both hits the
     comp figure and makes the rhythm uniform.

     31px, not 27.5px: the glyph gap runs ~4px under the padding value
     because half-leading sits inside the line box (verified — 15px
     padding measured an 11px glyph gap, 16px measured 12px). Margins
     are zeroed so the padding is the single source of truth; two of
     these eyebrows were spacing themselves with margin-bottom instead
     (32px on the brochures one, 8.8px on the newsletter one). */
  .home .kt-adv-heading6_e8ad9a-3e.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_d1325c-55.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_8d7d87-81.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_07bc8e-0a.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_9ff414-69.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_1be5d7-d4.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_7baf6d-bc.wp-block-kadence-advancedheading {
    padding-bottom: 31px !important;
    margin-bottom: 0 !important;
  }

  /* The brochures heading pulls itself up 15px, which would swallow
     half of the gap just set on the eyebrow above it. Neutralised on
     mobile only; its desktop offset is untouched. */
  .home .kt-adv-heading6_b28abc-57.wp-block-kadence-advancedheading {
    margin-top: 0 !important;
  }

  /* ── "Tour Accommodation" heading word-break ────────────────
     Paul's 24 Jul email, item d: "suggest the 'Tour Accommodation'
     title is made a little smaller so we don't get the word break."

     At the tour sections' shared 48px, the single word
     "Accommodation" measures 367px against a 271px content box — 96px
     over, so it can only break mid-word. No other heading on the page
     is close: the next tightest is "Mobility Information" at 260px in
     279px, with 19px to spare.

     A sitewide sweep at 375px (homepage, tour category, tours archive,
     Our History, About Us, Meet Our Experts, Our Brochures, blog,
     contact) found NO other heading that genuinely breaks mid-word, so
     this is the only instance. Two near-misses on the category page
     ("Destination", "Date" in the filter sidebar) are shrink-to-fit
     boxes measuring 2–4px over — rounding noise, not real breaks.

     Targeted via #hotels because the Kadence class is generated per
     tour and differs on every one (kt-adv-heading1994_613e60-53 on
     Frescoes in Florence, kt-adv-heading6870_338f86-23 on The Flemish
     Masters), so no class-based selector can reach all 149 tours. The
     #hotels anchor is stable across tours and contains exactly one h2.

     Clamped rather than fixed because the box narrows with the
     viewport: the widest word needs roughly (viewport − 104) × 0.131
     to fit, i.e. ≤28px at 320px and ≤35px at 375px. 8.5vw gives 27px
     and 32px respectively, with the 36px cap taking over on larger
     phones. */
  #hotels h2 {
    font-size: clamp(26px, 8.5vw, 36px) !important;
  }

  /* ── Tour card title alignment ──────────────────────────────
     Every other element in a tour card is inset 24px on mobile —
     .tour-badge, .tour-departure, .tour-footer, the price and the
     button — but the title sat flush at 0, so it hung out to the left
     of the date and price beneath it, and butted straight against the
     bottom of the image with no gap at all.

     The 24px comes from the carousel plugin's own mobile rule
     (plugins/tours-cards-block767 style.css, `.tour-departure {
     margin-left: 24px; margin-right: 24px }`), which simply never
     included .tour-title. Matching it with margins rather than padding
     keeps this consistent with how the sibling is done, and avoids
     fighting the `padding: 0 !important` on .tour-title at line ~1198
     of this file. (That !important is also why an existing
     `.home h2.tour-title { padding: 5% }` rule has never applied. 5%
     of a 373px card is 18.65px, which would not have lined up with the
     siblings' 24px anyway.)

     15px top margin restores the gap the same card already has on
     desktop, where the image ends 195px down and the title starts at
     210px. On mobile that gap was 0.

     Applies to both homepage carousels — Our Most Loved Journeys and
     Discover Hidden Experiences share the .tour-card markup. */
  .tours-slider-wrapper h2.tour-title {
    margin-top: 15px;
    margin-left: 24px;
    margin-right: 24px;
  }

  /* "Our Most Loved Journeys" had effectively no space between its H2
     and the carousel — a 1px gap, where "Discover Hidden Experiences"
     has 38px.

     Two parts to matching it, because the two headings are built
     differently. Discover Hidden Experiences gets 25px from its own
     padding-bottom PLUS 13px of inter-row spacing, because its heading
     sits in a separate Kadence row (6_d615c9-f) above the carousel
     row. Our Most Loved Journeys has its heading directly above the
     carousel in the same row, so it gets no inter-row gap at all.

     The 25px padding mirrors the other heading like-for-like; the 12px
     margin stands in for the row gap it does not get for free. Total
     38px, matching measured-for-measured.

     The margin needs !important: an earlier rule in this same file,
     `.home .kadence-column6_448288-7c .kt-adv-heading6_61484f-0b`,
     already pins margin-bottom to 0 with !important, and an
     !important beats a normal declaration however specific it is. That
     rule carries no media query, so it was also flattening this
     heading on mobile. Scoped inside max-width:767px here, so its
     desktop behaviour is left exactly as it was. */
  html body.home.home .kt-adv-heading6_61484f-0b.wp-block-kadence-advancedheading {
    padding-bottom: 25px;
    margin-bottom: 12px !important;
  }

  /* ── Mobile header: logo size / hamburger off-screen ────────
     Paul's 24 Jul email, item a: "The current lead stripe needs to be
     updated in line with visuals, e.g. logo is too large, hamburger
     falls off screen."

     Measured on the live site at 375px before this fix:
       header content wrap   24 → 351   (correct 24px gutter)
       logo                  24 → 359   335px wide, 86px tall
       right section         359 → 396  (21px PAST the viewport)
       hamburger icon        367 → 387  (12px off-screen)

     Cause is ours, not Kadence's. Kadence's own inline style caps the
     logo at 300px; global.css raises it to 335px in an unscoped rule
     (`.site-branding a.brand img`, no media query), so a
     desktop-oriented width was being applied at every size. At 335px
     the logo alone exceeds the 327px content width, so the header's
     right-hand section — which holds the toggle — gets pushed past the
     screen edge.

     218px comes from the mobile comp (new mobile design 17
     meganav.psb): the logo smart object is bbox (55,220,711,357), i.e.
     656 × 137 design px on a 1290px canvas that represents a 430px
     viewport, so 656 × 0.3333 = 218.7px wide by 45.7px tall. That also
     restores the vertical breathing room — at 335px the logo was 86px
     tall and exactly filled the header, leaving no padding at all.

     Same selector as the rule being overridden so it wins on source
     order from inside the media query, without escalating specificity
     or reaching for !important. */
  .site-branding a.brand img {
    max-width: 218px;
  }

  /* ── alignwide rows clipped at both edges ───────────────────
     Paul's 24 Jul email, item b (homepage margins).

     These four rows are `alignwide` and break out of the content
     column with `margin: 0 -24px`, but unlike the other rows nothing
     compensates on either side — their .kt-row-column-wrap and
     .kt-inside-inner-col both carry 0 padding. So on a 375px screen
     their content sat at -24 → 399px, i.e. clipped by 24px at BOTH
     edges. Measured on the live site: the tour cards in "Discover
     Hidden Experiences" ran -23 → 398px, and the brochures panel
     image -24 → 399px.

     It read as a subtle crop rather than an obvious overflow because
     the page itself never scrolled horizontally (documentElement
     scrollWidth stayed at 375) — the excess was simply cut off.

     Cancelling the breakout puts them on 0 → 375px, which is where
     rows 0–4 already sit, so "Discover Hidden Experiences" now lines
     up with the "Our Most Loved Journeys" carousel above it (whose
     cards measure 1 → 374px). No gutter is added here deliberately:
     these are full-bleed heading/card sections, and 24px would make
     them inconsistent with the rows above. The newsletter panel is
     the exception and is indented on purpose — it has a panel
     background and bordered form fields that need the breathing room
     (see assets/newsletter-gravity-forms.css).

     Not applied blanket to `.alignwide` — row 6_b95795-f5 ("What Our
     Guests Say") is also alignwide but already sits correctly at
     0 → 375px, and the newsletter row handles its own case. */
  .home .kb-row-layout-id6_06294e-6a,
  .home .kb-row-layout-id6_ab5ddd-9a,
  .home .kb-row-layout-id6_01a1ee-8e,
  .home .kb-row-layout-id6_04a95a-64 {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* The homepage authors TWO mutually-exclusive stripes: the
     brochure ribbon (kb-v-sm-hidden, so desktop-only) and a
     mobile-only variant reading "Escorted cultural tours for
     curious travellers" (kb-v-lg-hidden kb-v-md-hidden). Per the
     same email the mobile stripe should be the brochure one, so
     swap which of the pair is shown. Both rules need to beat
     Kadence's own .kb-v-*-hidden { display: none !important }. */
  .home .kb-row-layout-id6_4e2597-ef.kb-v-lg-hidden {
    display: none !important;
  }

  .home .kb-row-layout-id6_7cbe63-e7.kb-v-sm-hidden {
    display: block !important;
  }

  /* Major section H2s — PSD wants ALL of these uniform at 139
     design-px (46.3px), not the desktop-derived 3.6rem (57.6px)
     5 of them share via an existing global.css rule, the 2 that
     get to 57.6px their own way via per-block inline styles, and
     "Our Most Loved Journeys"'s own separate (also wrong) 48px.
     Letter-spacing doesn't need a matching override — it's set
     sitewide in em (0.02em) on h1/h2/h3, so it scales down with
     font-size automatically. */
  /* .home doubled deliberately (valid CSS, matches identically) to
     add a 4th class-level specificity component — "Discover Hidden
     Experiences" (2a6d3b-d8) has an existing, unrelated
     body.home .category-slider... rule at (0,4,1); class count is
     compared before type count, so "html body" alone (0,3,2)
     wasn't enough to beat their 4 classes. */
  html body.home.home .kt-adv-heading6_4e7e2a-f8.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_0639c1-05.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_afde7b-53.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_b28abc-57.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_fc592a-ae.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_2a6d3b-d8.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_26ffc6-43.wp-block-kadence-advancedheading,
  html body.home.home .kt-adv-heading6_61484f-0b.wp-block-kadence-advancedheading {
    font-size: 46.3px !important;
  }

  /* Eyebrow labels (Established 1994 / Featured Tours / From Our
     Travellers / Browse By Interest / 2027 Brochures Now
     Available / Meet Our Tour Lecturers) — size is already close
     (17.6px live vs 16.7px target) but under-tracked: ~1% live vs
     the PSD's 5% (50/1000em) tracking. 0.05 × 17.6px = 0.88px. */
  .home .kt-adv-heading6_e8ad9a-3e.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_d1325c-55.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_8d7d87-81.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_07bc8e-0a.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_9ff414-69.wp-block-kadence-advancedheading,
  .home .kt-adv-heading6_1be5d7-d4.wp-block-kadence-advancedheading {
    letter-spacing: 0.88px !important;
  }

  /* Mega-nav item text fix lives in mobile-menu.css directly
     (#mobile-drawer .mobile-navigation .menu a), not here — its
     specificity (1 ID + 2 classes) beat every override attempted
     from this file. See mobile-menu.css for the change. */

  /* Gutter bug: "The Travel Edition Experience" eyebrow + H2 (row
     kb-row-layout-id6_b45546-99) render completely flush to both
     screen edges — missing the 24px side padding their sibling
     paragraph already has. */
  .home .kb-row-layout-id6_b45546-99 .kt-adv-heading6_e8ad9a-3e.wp-block-kadence-advancedheading,
  .home .kb-row-layout-id6_b45546-99 .kt-adv-heading6_4e7e2a-f8.wp-block-kadence-advancedheading {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  /* Gutter bug: "What Our Guests Say" row's (kb-row-layout-id6_b95795-f5)
     alignwide -24px/-24px breakout margin has nothing to break out
     of on mobile — the containing chain has zero side padding all
     the way up — so the row overflows the viewport by 24px on the
     right. Combined with the H2's own 24px padding (meant to
     compensate for that same margin), the heading text ends up
     flush to both edges too, not just the row overflowing.
     Neutralizing the margin here lets the H2's existing padding
     provide the actual gutter, with no overflow. */
  .home .kb-row-layout-id6_b95795-f5.alignwide {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
}

/* Gravity Forms reCAPTCHA field — GF renders a normal field label
   ("reCAPTCHA") above this field same as any other, which looked fine
   when it rendered as a visible checkbox widget sitting right below the
   label. Now that reCAPTCHA is set to invisible mode sitewide (see
   recaptcha_setup memory), the field itself renders as a floating badge
   fixed to the corner of the screen, not inline — leaving this label
   orphaned above empty space. Scoped by GF's own field-type class
   (.gfield--type-captcha), not a form ID, so it applies to every form
   sitewide (currently newsletter #1 and brochure request #2) without
   duplicating the rule per form. */
.gfield--type-captcha .gfield_label,
.gfield--type-captcha .gform-field-label {
	display: none !important;
}

/*
 * Homepage "The Travel Edition Experience" 3-card row (Art & History Tours /
 * Escorted Tours / Great British Heritage) — per user request 2026-07-22,
 * "Learn More" buttons weren't anchored to a common bottom edge, since
 * varying card-copy length left the shorter cards' buttons sitting higher
 * than the others (confirmed live: Great British Heritage's column was
 * 21px shorter than its siblings, un-stretched).
 *
 * Root cause, two layers deep: `.kt-row-column-wrap` for this row is a CSS
 * grid (`grid-template-columns: repeat(3, minmax(0,1fr))`), and grid's
 * default `align-items: stretch` already stretches each
 * `.wp-block-kadence-column` grid item to the row's full height — but the
 * column's own inner wrapper, `.kt-inside-inner-col`, doesn't inherit that
 * stretched height automatically; it only ever grows to fit its own
 * content, so it needed an explicit `height: 100%` to actually fill its
 * now-equal-height grid-item parent. That alone wasn't enough, though:
 * Kadence's own per-block CSS sets `flex-direction: column` on this
 * element but never actually sets `display: flex` anywhere for it — it was
 * still `display: block` (confirmed via computed style), so the leftover
 * space from `height: 100%` just sat as dead space *after* the button
 * (bottom of the box) instead of being distributable. Adding `display:
 * flex` here makes the column a real flex column, so `margin-top: auto` on
 * the button wrapper can finally consume that space and push the button
 * down — the same flex-column-plus-auto-margin pattern already used for
 * the tour-card and expert-bio carousels elsewhere on this page (see the
 * 2026-07-09 button/price-row bottom-alignment fix note in
 * project_travel_editions memory).
 */
.kadence-column6_3cc2b0-44 > .kt-inside-inner-col,
.kadence-column6_f4896a-36 > .kt-inside-inner-col,
.kadence-column6_fad5c5-77 > .kt-inside-inner-col {
	height: 100%;
	display: flex;
}

/*
 * Scoped with `body.home` (not just the bare class) because the parent
 * Kadence theme's own content.min.css carries a higher-specificity reset —
 * `.single-content .wp-block-kadence-advancedbtn { margin-top: 0px; }`
 * (two classes, 0-2-0) — that otherwise beats a bare single-class selector
 * (0-1-0) regardless of stylesheet load order and silently zeroes this
 * back out. `body.home` + the class is 0-2-1, which wins outright.
 */
body.home .kb-btns6_585985-80,
body.home .kb-btns6_e2c618-f8,
body.home .kb-btns6_7c587a-5d {
	margin-top: auto !important;
}

/*
 * "Why Choose Travel Editions?" reusable block (ref 8718) — text-only
 * variant with no icon row, used by the "Why Choose — Blue Row" / "Why
 * Choose — White Row" patterns (and directly on the Our Brochures page).
 * Typography/spacing baked in here (not page-scoped) so the block renders
 * consistently on whatever page an editor drops it into. Values matched
 * exactly to the tour category archive's own "Why Choose" text
 * (kadence_element 1898, see tour-category-layout.css) via direct
 * getBoundingClientRect() measurement on
 * /tour-category/great-british-heritage-tours/ (2026-07-24): 50px column
 * padding, 7px eyebrow-to-heading gap, 29px heading-to-paragraph gap,
 * centered, 58px/63.8px heading. !important needed to beat Kadence's own
 * per-block inline <style data-kb-block> tag, which has higher specificity
 * (adds an attribute selector) and is printed after this stylesheet.
 */
.kadence-column8718_d4e5f6-02 > .kt-inside-inner-col {
	padding-top: 50px;
	padding-bottom: 50px;
}

/*
 * font-family: Roboto !important is required here because WordPress's
 * sitewide Additional CSS forces ALL headings (h1-h6,
 * .wp-block-kadence-advancedheading) to minion-pro serif with !important —
 * the tour/category templates already claw their own h6 eyebrows back to
 * Roboto via a `.tours-template-default h6` !important override in that
 * same sitewide CSS, but this page doesn't carry that body class, so this
 * block's own (non-important) Roboto attribute was silently losing to the
 * blanket serif rule. Confirmed via getComputedStyle on both pages
 * (2026-07-24): reference eyebrow (kt-adv-heading1898_102969-ec) renders
 * Roboto, this one was rendering minion-pro before this fix.
 */
/*
 * Alignment matches the tour category "Why Choose" block exactly (verified
 * live on /tour-category/great-british-heritage-tours/ 2026-07-24):
 * eyebrow + heading are CENTRED, the body paragraph is LEFT.
 */
.kt-adv-heading8718_a7b8c9-03.wp-block-kadence-advancedheading {
	margin-bottom: 7px !important;
	text-align: center !important;
	font-family: Roboto, sans-serif !important;
}

.kt-adv-heading8718_d0e1f2-04.wp-block-kadence-advancedheading {
	margin-bottom: 29px !important;
	font-size: 58px !important;
	line-height: 63.8px !important;
	font-weight: 500 !important;
	text-align: center !important;
}

.kt-adv-heading8718_a3b4c5-05.wp-block-kadence-advancedheading {
	margin-bottom: 0 !important;
	text-align: left !important;
	font-size: 16px !important;
	line-height: 21px !important;
}