/*
Theme Name: Valencia Court
Theme URI: https://valenciahotelcollection.com
Author: SDCO Partners
Author URI: https://stitchdesignco.com
Description: Child theme of Valencia for the Court hotel properties (Lone Star, Texican, Cotton, Cavalry, Caravan). Overrides styles and templates from the hotel theme; per-site branding applied per property.
Template: valencia
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: valencia-court
Update URI: false
*/

/* ─── Default Court faces (Caravan's picks) ─────────────────────────────
   Each Court site is heavily personalized: fonts and palettes are per-site
   brand variables, not theme constants. These @font-face rules cover the
   theme defaults; a property using different faces registers them through
   Settings → Valencia (valencia_brand_css prints the @font-face + swaps
   the --vhc-court-font-* variables). */
@font-face {
	font-family: 'TAY Lennon';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/caravan/TAYLennonRegular.woff2') format('woff2'),
		url('assets/fonts/caravan/TAYLennonRegular.woff') format('woff');
}

@font-face {
	font-family: 'TAY RoadRunner';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/caravan/TAYRoadRunnerRegular.woff2') format('woff2'),
		url('assets/fonts/caravan/TAYRoadRunnerRegular.woff') format('woff');
}

@font-face {
	font-family: 'IBM Plex Mono';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/ibm-plex-mono/ibm-plex-mono-400.woff2') format('woff2');
}

@font-face {
	font-family: 'IBM Plex Mono';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('assets/fonts/ibm-plex-mono/ibm-plex-mono-500.woff2') format('woff2');
}

/* ─── Cotton Court faces (Figma style sheet 12037:10704) ────────────────
   Coconat for display + accent subheads (the sheet spells it "Coconaut";
   the face is Coconat by Sara Lavazza for Collletttivo, SIL OFL — credit
   the designer and foundry when publishing), Compagnon Roman (400) for
   body and Medium (500) for kickers/buttons/nav (Velvetyne, SIL OFL).
   Both self-hosted in assets/fonts/cotton/ (licences alongside). Declared
   here rather than through the brand_font_*_url options because the
   option path can only register one weight per family. */
@font-face {
	font-family: 'Coconat';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/cotton/Coconat-Regular.woff2') format('woff2'),
		url('assets/fonts/cotton/Coconat-Regular.woff') format('woff');
}

@font-face {
	font-family: 'Compagnon';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/cotton/Compagnon-Roman.woff2') format('woff2'),
		url('assets/fonts/cotton/Compagnon-Roman.woff') format('woff');
}

@font-face {
	font-family: 'Compagnon';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('assets/fonts/cotton/Compagnon-Medium.woff2') format('woff2'),
		url('assets/fonts/cotton/Compagnon-Medium.woff') format('woff');
}

/* ─── Texican Court faces (Figma style sheet 12027:2229) ───────────────
   Piscolabis Regular (Ariel Martín Pérez / Tunera, SIL OFL) for display
   headlines and section heads; Combat Regular (Martin Desinde / Velvetyne,
   SIL OFL) for the accent subheads; Compagnon Roman/Medium for body,
   kickers, buttons, nav — the same files Cotton hosts in
   assets/fonts/cotton/ (declared above). Texican's two faces live in
   assets/fonts/texican/ with their licences. */
@font-face {
	font-family: 'Piscolabis';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/texican/Piscolabis-Regular.woff2') format('woff2'),
		url('assets/fonts/texican/Piscolabis-Regular.woff') format('woff');
}

@font-face {
	font-family: 'Combat';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/texican/Combat-Regular.woff2') format('woff2'),
		url('assets/fonts/texican/Combat-Regular.woff') format('woff');
}

/* ─── Cavalry Court faces (Figma style sheet 12037:7264) ───────────────
   Résistance Générale Regular (ENSAD Paris students / Velvetyne, SIL OFL)
   for display headlines and section heads — declared as "Resistance", the
   sheet's name; BackOut Medium (Velvetyne, SIL OFL) for the accent
   subheads, rooms titles, rewards stacks and review quote; Necto Mono
   Regular (Marco Condello / Collletttivo, SIL OFL) for body, kickers,
   buttons, nav. Files and licences in assets/fonts/cavalry/.

   The shipped Résistance drew lowercase `i` as a wide filled slab five
   times the width of `n` — BugHerd #412/#413 read it as "a line through"
   the reserve panel's text. Rebuilt in place; see the note and the script
   in assets/fonts/cavalry/. */
@font-face {
	font-family: 'Resistance';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/cavalry/ResistanceGenerale-Regular.woff2') format('woff2'),
		url('assets/fonts/cavalry/ResistanceGenerale-Regular.woff') format('woff');
}

@font-face {
	font-family: 'BackOut';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('assets/fonts/cavalry/BackOut-Medium.woff2') format('woff2'),
		url('assets/fonts/cavalry/BackOut-Medium.woff') format('woff');
}

@font-face {
	font-family: 'Necto Mono';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/cavalry/NectoMono-Regular.woff2') format('woff2'),
		url('assets/fonts/cavalry/NectoMono-Regular.woff') format('woff');
}

/* ─── Lone Star Court faces (Figma style sheet 12050:1619) ─────────────
   Chunk Five Regular (Meredith Mandel / The League of Moveable Type, SIL
   OFL) for display headlines and section heads — declared as "ChunkFive",
   the sheet's name; League Spartan SemiBold (The League of Moveable Type,
   SIL OFL) for body, kickers, buttons, nav — the one weight serves the
   whole 400–700 range so body text never falls back; Mattone Regular
   (Collletttivo, SIL OFL) for the accent subheads, rooms titles, package
   titles, rewards stacks and review quote. Files and licences in
   assets/fonts/lonestar/. */
@font-face {
	font-family: 'ChunkFive';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/lonestar/ChunkFive-Regular.woff2') format('woff2'),
		url('assets/fonts/lonestar/ChunkFive-Regular.woff') format('woff');
}

@font-face {
	font-family: 'League Spartan';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('assets/fonts/lonestar/LeagueSpartan-SemiBold.woff2') format('woff2');
}

@font-face {
	font-family: 'Mattone';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/lonestar/Mattone-Regular.woff2') format('woff2');
}

/* ─── Court base ────────────────────────────────────────────────────────
   The parent's machinery reads the preset custom properties, which the
   child theme.json maps onto --vhc-court-* slots — so inherited components
   (reserve panel, popup, buttons, sliders) recolor to each Court without
   further CSS. Court-specific section styles accumulate below as the
   homepage patterns are built. */

body.is-brand-court {
	-webkit-font-smoothing: antialiased;

	/* Texican #4 — theme.json sets a body weight of 500 for every Court, but
	   the five run different body faces and they don't all want the Medium
	   cut. Texican's style-sheet specimen is Compagnon Roman; the site was
	   rendering Compagnon Medium, which is why the copy read heavier than
	   the sheet. Per brand now, via brand_type_body_weight; unset keeps the
	   500 the other four have been signed off at. */
	font-weight: var(--vhc-court-body-weight, 500);
}

/* Texican #2 — art over a hero is the ground colour, not pure white, so the
   chrome, taglines and scroll dot read as the brand's offwhite rather than a
   brighter white the palette never uses. The parent theme already intended
   this (its transparent-header rules use pearl); the Court dress had
   hard-coded #fff over the top. One variable so a brand can opt out.

   On :root, not on body: valencia_court_brand_css() prints the per-brand
   options into `:root{…}`, and brand_type_phero_kicker now holds
   `var(--vhc-court-hero-art)` so the interior-hero eyebrow tracks the title.
   Declared on body it would be out of scope there and that option would
   resolve to nothing. */
:root {
	--vhc-court-hero-art: var(--wp--preset--color--pearl);
}

/* ─── Court header ──────────────────────────────────────────────────────
   Same skeleton as the parent header (tab / brand / toggle); the Court
   dress: transparent over the hero with white chrome, mono BOOK tab with
   vertical rules, mask-drawn property mark. Past-hero the parent's
   is-past-hero mechanics swap to the ground + ink. */
body.is-brand-court .site-header__inner {
	min-height: 73px;
}

body.is-brand-court .site-header__reserve {
	align-items: center;
	background: none;
	border-right: 1px solid currentColor;
	color: inherit;
	display: flex;
	font-size: 0.875rem;
	font-weight: 500;
	height: 73px;
	justify-content: center;
	letter-spacing: 0.1em;
	padding: 0;
	width: clamp(96px, 11vw, 158px);
}

body.is-brand-court .site-header__reserve:hover {
	background: var(--wp--preset--color--golden-hour);
	color: var(--wp--preset--color--midnight);
}

body.is-brand-court .site-header__toggle {
	border-left: 1px solid currentColor;
	height: 73px;
	padding: 0 clamp(1.5rem, 4vw, 3.75rem);
}

body.is-brand-court.has-immersive-hero .site-header:not(.is-past-hero) {
	background: transparent;
	border-bottom-color: rgba(252, 249, 234, 0.6);
	color: var(--vhc-court-hero-art);
}

body.is-brand-court.has-immersive-hero .site-header:not(.is-past-hero) .site-header__reserve,
body.is-brand-court.has-immersive-hero .site-header:not(.is-past-hero) .site-header__toggle {
	color: var(--vhc-court-hero-art);
}

.site-brand--mark {
	display: block;
}

.site-brand--mark::before {
	background: currentColor;
	content: '';
	display: block;
	height: 48px;
	-webkit-mask: var(--brand-mark) no-repeat center / contain;
	mask: var(--brand-mark) no-repeat center / contain;
	width: 74px;
}

body.is-brand-court.has-immersive-hero .site-header:not(.is-past-hero) .site-brand--mark {
	color: var(--vhc-court-hero-art);
}

/* The flag sits tight against the bar's rules in the open menu; give it
   room on either side of the mark (BugHerd #19). */
.overlay-nav__brand .site-brand--mark {
	padding: 0.75rem 1.5rem;
}

/* ─── Court footer ─────────────────────────────────────────────────── */
.court-footer {
	background: var(--wp--preset--color--court-blue);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.court-footer a {
	color: inherit;
	text-decoration: none;
}

.court-footer__main {
	display: grid;
	gap: 2rem;
	grid-template-columns: 1fr auto 1fr;
	margin: 0 auto;
	max-width: 1380px;
	padding: clamp(3.5rem, 7vw, 6.5rem) 1.5rem 2rem;
}

.court-footer__col--left {
	text-align: center;
}

.court-footer__col--right {
	text-align: center;
}

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

/* Tighter than the 1.6 the column inherited — the menu reads as one
   block rather than a loose list (BugHerd #36). "Accessible
   Accommodations" keeps its own line rather than wrapping (#41). */
.court-footer__nav li {
	line-height: 1.25;
	margin: 0 0 0.125rem;
	white-space: nowrap;
}

/* BugHerd #455 — "when I select that tab, it disappears into the background".
   Not a broken link, which is why every link near the pin tested fine: the
   HOVER colour was court-maroon, and on Texican maroon IS the footer colour
   (#60271a on #60271a, 1.00:1 — literally invisible). Measured across all five
   Courts the old rule ran 1.00 / 1.35 / 1.73 / 1.38 / 3.19, so it was failing
   everywhere, not just where it got reported.

   The accent slot is golden-hour (there is no court-accent slug), but the
   accent ITSELF is still too dark on three of five: 1.87 Texican, 2.05 Cotton,
   2.41 Caravan. Its light variant is the one that holds up — golden-hour-tint
   measures 7.46 / 6.88 / 3.50 / 6.60 / 3.33, the only accent-family token
   legible on every Court footer.

   Honest about the standard: the links are 14px/500, i.e. normal text, so AA
   wants 4.5:1 and Cotton (3.50) and Caravan (3.33) sit under it. They are far
   above the 1.00 they replace, and the resting state is white at 11.65:1, so
   nothing is unreadable at rest. If AA on the hover matters, the fix is an
   underline rather than a darker brand colour — no token in the palette
   reaches 4.5 on all five backgrounds.

   :focus-visible is included because the old rule covered hover only, which
   left keyboard users with no indication at all.

   SCOPED TO THE WHOLE FOOTER, not just the nav. Fixing the nav alone left
   Privacy Policy and Accessibility behaving differently, which is exactly how
   this came back a second time. An audit of every anchor in the footer found
   only the nav had any hover at all: the legal links, the phone number, the
   social icons and "Discover the Collection" had none. The social SVGs draw
   with currentColor, so a colour hover reaches them too.

   .court-footer__manage is excluded deliberately — it is the bordered button
   and inverts on hover (white fill, blue text) rather than tinting. */
.court-footer a:not(.court-footer__manage):hover,
.court-footer a:not(.court-footer__manage):focus-visible {
	color: var(--wp--preset--color--golden-hour-tint);
}

.court-footer__manage {
	border: 1px solid #fff;
	display: inline-block;
	margin-top: 2.25rem;
	padding: 0.875rem 1.5rem;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.court-footer__manage:hover {
	background: #fff;
	color: var(--wp--preset--color--court-blue);
}

.court-footer__phone {
	margin: 1.375rem 0 0;
}

.court-footer__social {
	display: flex;
	gap: 1.125rem;
	justify-content: center;
	margin-top: 1.25rem;
}

.court-footer__center {
	align-self: start;
	padding-top: 1rem;
}

/* Texican #17 — the lockup was 290px against the comp's 257 (measured off
   the 2x export: a 514px mark on a 1443px-wide footer, 17.8% of the width).
   255px is that proportion at this viewport. The phone override below keeps
   its own 200px. */
.court-footer__logo {
	display: block;
	height: auto;
	width: min(255px, 53vw);
}

/* Texican #17 — the ornament band was drawn at full strength and shouted
   over the type around it. 35%, as asked. */
.court-footer__divider {
	display: block;
	height: auto;
	margin: 2.5rem auto 0;
	opacity: 0.35;
	/* Same edges as the meta row's content — its 1380px max-width is
	   content-box (padding sits outside), so the ornament matches
	   "Keep tabs on us" and the colophon at 1380, not 1380 - padding. */
	max-width: min(1380px, calc(100% - 3rem));
	width: 100%;
}

.court-footer__meta {
	align-items: end;
	display: flex;
	gap: 2rem;
	justify-content: space-between;
	margin: 0 auto;
	max-width: 1380px;
	padding: 2.75rem 1.5rem 3rem;
}

.court-footer__label {
	margin: 0 0 0.75rem;
}

/* The legal row stacks and steps down a size, so it sits quietly under
   the newsletter rather than running the footer's full width (#40). */
.court-footer__legal {
	align-items: flex-end;
	display: flex;
	flex-direction: column;
	font-size: 0.75rem;
	gap: 0.5rem;
}

.court-footer__legal-nav ul {
	align-items: baseline;
	display: flex;
	gap: 1.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.court-footer__legal-nav a {
	text-decoration: underline;
	text-underline-offset: 0.35em;
}

.court-footer__colophon {
	margin: 0;
	text-align: right;
}

/* Newsletter (GF) in court dress: white underline field + submit. */
.court-footer .valencia-newsletter form {
	align-items: flex-end;
	display: flex;
	gap: 1.75rem;
}

/* Lone Star #9 — "change 'Enter Email Address' type".
   This rule always meant the body face, and never got it on any Court: the
   parent's .valencia-newsletter rule carries `!important` on font-family,
   size and colour so it can beat Gravity Forms' Orbital theme, and a plain
   declaration here loses to it however specific the selector. Every Court was
   therefore typing its newsletter field in its DISPLAY face — ChunkFive on
   Lone Star, Coconat on Cotton, Resistance on Cavalry, Piscolabis on Texican,
   TAY Lennon on Caravan — a heavy titling slab in a form field. Only Lone
   Star's was reported. `!important` on the three that were being overridden
   is what it takes; the rest of the rule was already winning. */
.court-footer .valencia-newsletter input[type='email'] {
	border-bottom-color: #fff !important;
	color: #fff !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: 0.875rem !important;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	width: 263px !important;
}

/* Caravan #38. The field itself is tracked out 0.1em to sit with "Keep tabs
   on us" above it, but ::placeholder was measuring `normal` — so the words
   the visitor actually sees, "ENTER EMAIL ADDRESS", were the one piece of
   type in the band that was not letterspaced. ::placeholder does inherit
   letter-spacing; Gravity Forms' Orbital theme sets its own and wins, so the
   value has to be repeated here rather than left to inheritance. */
.court-footer .valencia-newsletter input[type='email']::placeholder {
	color: rgba(255, 255, 255, 0.5);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.court-footer .valencia-newsletter .gform_footer input[type='submit'],
.court-footer .valencia-newsletter .gform_footer button {
	border-bottom-color: #fff !important;
	color: #fff !important;
	font-size: 0.875rem !important;
	letter-spacing: 0.1em !important;
}

.court-footer .valencia-newsletter .gform_footer input[type='submit']:hover {
	border-bottom-color: var(--wp--preset--color--golden-hour) !important;
	color: var(--wp--preset--color--golden-hour) !important;
}

/* Texican #18 — the rule took `court-blue-light`, a slot whose value is only
   meaningful on the brands that actually have a blue. On Texican it held
   #211514 against a #60271a footer; on Cavalry and Lone Star it held exactly
   the footer's own colour, so the rule was invisible on three of the five.
   Offwhite at 60% is what the comp measures (rgb(193,169,159) over the
   ground) — a hairline on every Court rather than a hard cream line. */
.court-footer__collection {
	align-items: center;
	border-top: 1px solid rgba(252, 249, 234, 0.6);
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	padding: 1.75rem 1.5rem;
}

.court-footer__collection p {
	/* #39 — the collection's face, not the Court's. See the parent theme's
	   --vhc-collection-font-display for why the preset cannot be used here. */
	font-family: var(--vhc-collection-font-display);
	font-size: 1.1875rem;
	letter-spacing: 0.13em;
	margin: 0;
}

@media (max-width: 981px) {
	.court-footer__main {
		grid-template-columns: 1fr;
		justify-items: center;
	}

	.court-footer__meta {
		flex-direction: column;
		gap: 2.5rem;
	}
}

/* ─── Court primitives ─────────────────────────────────────────────── */
@font-face {
	font-family: 'Instrument Serif';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/instrument-serif/instrument-serif-400.woff2') format('woff2');
}

.cc-kicker {
	align-items: center;
	display: flex;
	font-size: 1rem;
	font-weight: 600;
	gap: 0.625rem;
	letter-spacing: 0.1em;
	margin: 0;
	text-transform: uppercase;
}

.cc-kicker::before {
	/* Lone Star — "our stars do not align with the headline text ... the star
	   hangs below the baseline". align-items: center centres this mark on the
	   line box, and whether that lands on the baseline is a property of the
	   brand's face, not of this rule: against a 20.8px line, Caravan's IBM
	   Plex Mono reports ascent 16 and puts its baseline exactly on the line
	   centre (mark bottom 0.00 off it), while Lone Star's League Spartan
	   reports ascent 11, lifting its baseline 2.5px above — so the same mark
	   hung 2.5px low there and nowhere else.

	   Sitting the mark ON the baseline reads it off each face's own metrics,
	   so it is a no-op for the brands already correct and corrects Lone Star
	   alone; a nudge in pixels would have had to be retuned per brand. */
	align-self: baseline;
	background: currentColor;
	content: '';
	display: var(--vhc-court-kicker-mark, inline-block);
	flex: none;
	height: 12px;
	-webkit-mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	width: 14px;
}

/* Hunter, once the marks were on the baseline: "its slightly raised too high
   now can we lower it by like 5%". The mark is 12px but League Spartan's caps
   are 10.56px, so sitting it ON the baseline left it standing 1.44px proud of
   the cap line. Half of that, 0.72px, puts its centre on the cap band — 6% of
   the mark, which is what his eye was reading. 0.05em rather than a pixel so
   it tracks the kicker's size, and it lands within 0.1px of cap-centred.

   Lone Star only, deliberately. The right drop is (mark - cap height) / 2, so
   it is a property of the face: 0.72px here, but 0.29px on Caravan's IBM Plex
   Mono and 1.28px on Compagnon. Hunter has signed off the other Courts twice,
   and a shared 0.8px would have pushed Caravan 0.51px past its own cap centre
   — so the others keep the plain baseline they were approved on. Extend this
   per brand with their own value if they ever want the same correction. */
body.is-court-lonestar .cc-kicker::before,
body.is-court-lonestar.is-brand-court .vhc-rooms-grid .vhc-eyebrow--dot::before,
body.is-court-lonestar.is-brand-court .vhc-rooms-grid__subkicker::before,
body.is-court-lonestar.is-brand-court .vhc-igfeed__kicker.vhc-eyebrow--dot::before {
	position: relative;
	top: 0.05em;
}

/* Lone Star — "our stars do not align with the headline text". The mark is a
   flex item like the words are, so a centred kicker centred the whole star +
   gap + text group, leaving the TEXT 12px right of the headline above it:
   half the mark's 14px plus its 10px gap.

   Pulling the mark out of the row by its own footprint fixes that: the row's
   main size becomes the text's alone, so centring the row centres the words
   and the mark hangs to their left, still its 10px gap away. Two things this
   gets for free over padding the row or mirroring the mark on the trailing
   edge, both of which were tried first: the row gets NARROWER rather than
   24px wider, so it cannot wrap a kicker onto a second line at 390 (the
   mirror wrapped "Exclusively at Lone Star Court"), and it rides on the mark
   itself — where a brand runs kicker_mark: none, or a rule drops the mark
   for one component, there is no pseudo-element and so no margin, with
   nothing to keep in step.

   Only centred kickers: a left-aligned row starts at the content edge, so
   pulling its mark 24px left would hang it in the gutter. This is every rule
   in this sheet that centres a kicker; if you add another, add it here. */
.cc-intro--center .cc-kicker::before,
.cc-intro--split .cc-kicker::before,
.cc-feature__mast .cc-kicker::before,
.cc-photoset__label .cc-kicker::before,
.cc-actions--center .cc-kicker::before,
.cc-packages > .cc-kicker::before,
.cc-dining__kicker::before,
body.is-court-caravan .cc-rooms__bar .cc-kicker::before,
body.is-court-caravan .cc-gallery__bar > .cc-kicker::before {
	margin-left: calc((14px + 0.625rem) * -1);
}

.cc-kicker--band { color: var(--wp--preset--color--court-band); }
.cc-kicker--cream { color: var(--wp--preset--color--pearl); }
.cc-kicker--ink { color: var(--wp--preset--color--midnight); }

/* Texican #3 — the eyebrow was the only thing in the band that wasn't
   maroon: it took `court-band`, which on Texican is the olive #725f22,
   beside a maroon headline and maroon copy. Scoped to Texican rather than
   widened: `court-band` is a different accent on each of the five, and this
   is a call from Texican's review, not the other boards'. All 40 --band
   eyebrows on the site sit on cream or white, so none of them lose
   legibility. The star rides on currentColor and goes maroon with it. */
body.is-court-texican .cc-kicker--band {
	color: var(--wp--preset--color--court-maroon);
}

/* Texican #6 — a star above the dining eyebrow. Texican sets
   brand_type_kicker_mark to `none` ("the comp's kickers carry no mark"), so
   this is a standalone ornament above the band rather than the inline mark
   switched back on — the same shape the review card uses for its mark. The
   star is the one cut for #20/#27, drawn in the eyebrow's own colour. */
body.is-court-texican .cc-dining::before {
	background: var(--wp--preset--color--court-maroon);
	content: '';
	display: block;
	height: 25px;
	margin: 0 auto 1.125rem;
	-webkit-mask: var(--vhc-court-kicker-star) no-repeat center / contain;
	mask: var(--vhc-court-kicker-star) no-repeat center / contain;
	width: 28px;
}

/* Core button blocks in Court dress (block styles registered in
   functions.php). Keyline: 2px border in the tone's color, fills on hover.
   The parent's button element styles (midnight fill, pill padding) are
   reset here so the Court keyline reads exactly as before. */
.wp-block-button.is-style-cc-ink > .wp-block-button__link,
.wp-block-button.is-style-cc-cream > .wp-block-button__link,
.wp-block-button.is-style-cc-band > .wp-block-button__link {
	background: transparent;
	border: 2px solid currentColor;
	border-radius: 0;
	display: inline-block;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.2;
	padding: 0.875rem 1.5rem;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.wp-block-button.is-style-cc-cream > .wp-block-button__link { color: var(--wp--preset--color--pearl); }
.wp-block-button.is-style-cc-cream > .wp-block-button__link:hover { background: var(--wp--preset--color--pearl); color: var(--wp--preset--color--court-band); }
.wp-block-button.is-style-cc-ink > .wp-block-button__link { color: var(--wp--preset--color--midnight); }
.wp-block-button.is-style-cc-ink > .wp-block-button__link:hover { background: var(--wp--preset--color--midnight); color: var(--wp--preset--color--pearl); }
.wp-block-button.is-style-cc-band > .wp-block-button__link { color: var(--wp--preset--color--court-band); }
.wp-block-button.is-style-cc-band > .wp-block-button__link:hover { background: var(--wp--preset--color--court-band); color: var(--wp--preset--color--pearl); }

/* Tracked underline link. */
.wp-block-button.is-style-cc-link > .wp-block-button__link {
	background: transparent;
	border: 0;
	border-radius: 0;
	color: inherit;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.2;
	padding: 0;
	text-decoration: underline;
	text-transform: uppercase;
	text-underline-offset: 0.3em;
}

.wp-block-button.is-style-cc-link > .wp-block-button__link:hover { color: var(--wp--preset--color--court-band); }

/* Inline link arrow — the same drawn mark as the pager (BugHerd #28),
   nudging forward on hover to read as a link (BugHerd #29). */
.wp-block-button.cc-link--arrow > .wp-block-button__link::after {
	background: currentColor;
	content: '';
	display: inline-block;
	height: 11px;
	margin-left: 0.625rem;
	-webkit-mask: var(--vhc-court-pager-arrow, url('assets/images/brands/caravan/pager-arrow.svg')) no-repeat center / contain;
	mask: var(--vhc-court-pager-arrow, url('assets/images/brands/caravan/pager-arrow.svg')) no-repeat center / contain;
	transition: transform 0.2s ease;
	vertical-align: baseline;
	width: 12px;
}

.wp-block-button.cc-link--arrow > .wp-block-button__link:hover::after,
.wp-block-button.cc-link--arrow > .wp-block-button__link:focus-visible::after {
	transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-button.cc-link--arrow > .wp-block-button__link::after { transition: none; }
}

/* Buttons rows nested in a Court group carry no inherited margin; the
   rows that need air (cc-actions__row, cc-intro__cta) set their own. */
:where(body.is-brand-court [class*="cc-"]) > .wp-block-buttons { margin: 0; }

.cc-band {
	padding: clamp(3.5rem, 7vw, 6rem) 0;
}

body.is-brand-court .entry-content img {
	border-radius: 8px;
}

/* ─── Court hero ────────────────────────────────────────────────────── */
.cc-hero .wp-block-cover__inner-container {
	height: 100%;
	position: static;
}

.cc-hero__wordmark {
	left: 50%;
	margin: 0;
	position: absolute;
	top: 42.5%;
	transform: translate(-50%, -50%);
	width: min(425px, 60vw);
	z-index: 1;
}

.cc-hero__wordmark img {
	border-radius: 0 !important;
	display: block;
	height: auto;
	width: 100%;
}

/* The cover block hands its children plain white; anything dropped into a
   Court hero should inherit the ground colour instead (#2). */
.cc-hero,
.cc-phero {
	color: var(--vhc-court-hero-art);
}

.cc-hero__tag {
	bottom: 9%;
	color: var(--vhc-court-hero-art);
	font-family: var(--wp--preset--font-family--script);
	/* Cotton #1 and Cavalry #2 both ask for this larger "just on this site" —
	   the script faces are set at wildly different optical sizes, so the one
	   figure never suited all five. */
	font-size: var(--vhc-court-hero-tag-size, 1.5rem);
	line-height: 1.3;
	margin: 0;
	position: absolute;
	text-align: center;
	z-index: 1;
}

.cc-hero__tag--left { left: clamp(1.5rem, 4vw, 3.75rem); }
.cc-hero__tag--right { right: clamp(1.5rem, 4vw, 3.75rem); }

/* Texican #1 — the circle in the hero's corner is a PAUSE CONTROL for the
   brand video (Court style sheet 12050:1495: a 26px ring around a two-bar
   glyph 6.7 x 10.9). It had been built as a decorative down arrow on every
   hero, video or not; that arrow is gone. The ring belongs to the video, so
   a hero with no video now carries nothing in that corner — which is also
   what the style sheet draws.

   The pause control itself, built by court.js wherever a hero plays a video.
   Same 26px ring and corner the arrow used to occupy; the glyph is the
   comp's two bars — 2 + 2.7 + 2 gives its 6.7 width, at its 10.9 height. */
.cc-hero__pause {
	align-items: center;
	background: none;
	border: 1px solid var(--vhc-court-hero-art);
	border-radius: 50%;
	bottom: 2.5rem;
	color: var(--vhc-court-hero-art);
	cursor: pointer;
	display: flex;
	gap: 2.7px;
	height: 26px;
	justify-content: center;
	padding: 0;
	position: absolute;
	right: 2.5rem;
	transition: background-color 0.25s ease, color 0.25s ease;
	width: 26px;
	z-index: 2;
}

.cc-hero__pause span {
	background: currentColor;
	display: block;
	height: 11px;
	width: 2px;
}

.cc-hero__pause:hover {
	background: var(--vhc-court-hero-art);
	color: var(--wp--preset--color--court-blue);
}

.cc-hero__pause:focus-visible {
	outline: 2px solid var(--vhc-court-hero-art);
	outline-offset: 3px;
}

/* Paused: the bars give way to a play triangle. The style sheet only draws
   the pause state, so this glyph is ours — a triangle rather than the
   rotated bar the restaurant theme uses, which reads as a dash. The 2px
   nudge is optical centring: a triangle's visual centre sits left of its
   bounding box. */
.cc-hero__pause.is-paused span {
	display: none;
}

.cc-hero__pause.is-paused::before {
	border-color: transparent transparent transparent currentColor;
	border-style: solid;
	border-width: 5.5px 0 5.5px 9px;
	content: '';
	display: block;
	margin-left: 2px;
}

/* ─── Intro collage ─────────────────────────────────────────────────── */
.cc-collage {
	/* clip, not hidden: overflow:hidden makes this section a scroll
	   container, which captures the window images' view() timelines and
	   freezes the parallax. overflow:clip clips without doing that. */
	overflow: clip;
	padding: clamp(2rem, 4vw, 3rem) 0 clamp(3rem, 6vw, 5rem);
	position: relative;
}

/* Lone Star #4 — "can we move the images up closer to the copy". The windows
   are placed as percentages of this box, and its top quarter is empty: the
   first one starts at 25.1%, which put 203px of nothing between the intro's
   last line and the first photograph. Shortening the box alone would only
   scale the whole arrangement, so the brand moves its slots up as well; this
   var keeps the bottom margin the same rather than trading a gap at the top
   for one underneath. */
.cc-collage__field {
	aspect-ratio: var(--vhc-court-collage-field-aspect, 1440 / 1395);
	position: relative;
}

.cc-collage__piece {
	height: auto;
	position: absolute;
	z-index: 2;
}

.cc-collage__piece img {
	display: block;
	height: auto;
	width: 100%;
}

/* Slot geometry (comp: left %, top %, width %, aspect) — the pattern
   drops one image block per slot, so editors swap photos, not layout. */
.cc-collage__slot { margin: 0; }
.cc-collage__slot--1 { aspect-ratio: var(--vhc-court-collage-1-aspect, 471 / 264); left: var(--vhc-court-collage-1-left, -0.8%); top: var(--vhc-court-collage-1-top, 25.1%); width: var(--vhc-court-collage-1-width, 32.7%); }
.cc-collage__slot--2 { aspect-ratio: var(--vhc-court-collage-2-aspect, 295 / 443); left: var(--vhc-court-collage-2-left, 23.6%); top: var(--vhc-court-collage-2-top, 38.7%); width: var(--vhc-court-collage-2-width, 20.5%); }
.cc-collage__slot--3 { aspect-ratio: var(--vhc-court-collage-3-aspect, 240 / 271); left: var(--vhc-court-collage-3-left, 10.4%); top: var(--vhc-court-collage-3-top, 65.5%); width: var(--vhc-court-collage-3-width, 16.7%); }
.cc-collage__slot--4 { aspect-ratio: var(--vhc-court-collage-4-aspect, 285 / 372); left: var(--vhc-court-collage-4-left, 68.1%); top: var(--vhc-court-collage-4-top, 31.5%); width: var(--vhc-court-collage-4-width, 19.8%); }
.cc-collage__slot--5 { aspect-ratio: var(--vhc-court-collage-5-aspect, 449 / 298); left: var(--vhc-court-collage-5-left, 64.7%); top: var(--vhc-court-collage-5-top, 66.7%); width: var(--vhc-court-collage-5-width, 31.2%); }
.cc-collage__slot--6 { left: var(--vhc-court-collage-6-left, 5%); top: var(--vhc-court-collage-6-top, 51.6%); width: var(--vhc-court-collage-6-width, 15.1%); }
.cc-collage__slot--7 { left: var(--vhc-court-collage-7-left, 79.9%); top: var(--vhc-court-collage-7-top, 20.9%); width: var(--vhc-court-collage-7-width, 13.7%); }

/* Window reveal, dialed back per client: the photo oversizes its frame
   only slightly (~124%, so most of the image shows) and drifts a few
   percent as the window crosses the viewport — a bounded parallax via
   CSS scroll-driven animation. Browsers without support (and
   reduced-motion users) get the photo seated statically. */
.cc-collage__window {
	border-radius: 8px;
	/* clip-path (not overflow: hidden) — an overflow-hidden box is a
	   scroll container, which would hijack the img's view() timeline
	   and freeze the parallax. clip-path clips without doing that. */
	clip-path: inset(0 round 8px);
	display: block;
	position: absolute;
}

@supports not (clip-path: inset(0 round 8px)) {
	.cc-collage__window {
		overflow: hidden;
	}
}

.cc-collage__window img {
	border-radius: 0 !important;
	height: 140%;
	left: 0;
	object-fit: cover;
	position: absolute;
	top: -20%;
	width: 100%;
}

@supports (animation-timeline: view()) {
	.cc-collage__window img {
		animation: cc-window-parallax linear both;
		animation-timeline: view();
	}
}

@keyframes cc-window-parallax {
	from {
		transform: translateY(-14%);
	}

	to {
		transform: translateY(14%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.cc-collage__window img {
		animation: none;
	}
}

.cc-collage__medallion {
	color: var(--wp--preset--color--court-band);
	left: 50%;
	max-width: 400px;
	position: absolute;
	text-align: center;
	top: clamp(2rem, 6vw, 5rem);
	transform: translateX(-50%);
	width: calc(100% - 3rem);
}

.cc-collage__kicker {
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	margin: 0 0 1.375rem;
	text-transform: uppercase;
}

.cc-collage__head {
	color: var(--vhc-court-headline-color, inherit);
	font-size: var(--vhc-court-headline-size-lg, var(--wp--preset--font-size--x-large));
	letter-spacing: var(--vhc-court-headline-tracking, normal);
	line-height: var(--vhc-court-headline-leading, 1.15);
	margin: 0 0 1.375rem;
	text-transform: var(--vhc-court-headline-transform, none);
}

.cc-collage__copy {
	margin: 0;
}

/* ─── Rooms band ────────────────────────────────────────────────────── */
.cc-rooms {
	background: var(--wp--preset--color--court-blue-light);
	color: var(--wp--preset--color--pearl);
	overflow: hidden;
}

.cc-rooms__bar {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin: 0 auto 2.5rem;
	max-width: min(1380px, calc(100% - 3rem));
}

.cc-pager {
	align-items: center;
	display: flex;
	font-size: 0.875rem;
	font-weight: 500;
	gap: 0.875rem;
	letter-spacing: 0.1em;
}

.cc-pager__arrow {
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
	padding: 0.25rem;
	position: relative;
}

/* The property's own drawn arrow, masked so it takes the pager's colour,
   in place of the unicode glyphs (BugHerd #21, called out as universal).
   Caravan's file is the stylesheet fallback; other Courts override the var
   from their own brand folder in valencia_court_brand_css(). */
.cc-pager__arrow::before {
	background: currentColor;
	content: '';
	display: block;
	height: 12px;
	-webkit-mask: var(--vhc-court-pager-arrow, url('assets/images/brands/caravan/pager-arrow.svg')) no-repeat center / contain;
	mask: var(--vhc-court-pager-arrow, url('assets/images/brands/caravan/pager-arrow.svg')) no-repeat center / contain;
	transition: transform 0.2s ease;
	width: 13px;
}

.cc-pager__arrow--prev::before { transform: scaleX(-1); }

/* A nudge in the direction of travel on hover, so the arrows read as
   controls rather than ornament (BugHerd #29). */
.cc-pager__arrow--next:hover::before { transform: translateX(3px); }
.cc-pager__arrow--prev:hover::before { transform: scaleX(-1) translateX(3px); }

@media (prefers-reduced-motion: reduce) {
	.cc-pager__arrow::before { transition: none; }
}

/* Slide widths. The parent's generic enhanced-slide rule
   (.vhc-slider.is-enhanced .splide__slide) would outrank a two-class
   selector, so these match its specificity; the no-JS / editor row gets
   the same widths on the slide blocks themselves. */
.cc-rooms__slider .splide__slide,
.vhc-slider.is-enhanced.cc-rooms__slider .splide__slide,
.cc-rooms__slider .vhc-slider__row > .cc-rooms__slide {
	flex: none;
	width: min(860px, 86vw);
}

.vhc-slider.is-enhanced.cc-review__slider .splide__slide,
.vhc-slider.is-enhanced.cc-venues__slider .splide__slide,
.vhc-slider.is-enhanced.cc-photoset__slider .splide__slide {
	width: 100%;
}

.cc-review__slider .vhc-slider__row > *,
.cc-venues__slider .vhc-slider__row > *,
.cc-photoset__slider .vhc-slider__row > * {
	flex: 0 0 100%;
}

.cc-rooms__media {
	margin: 0 0 2rem;
}

.cc-rooms__media img {
	aspect-ratio: 860 / 568;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	transition: aspect-ratio 0.3s ease;
	width: 100%;
}

/* Side slides dim until focused. */
.cc-rooms__slider .splide__slide:not(.is-active) .cc-rooms__detail {
	opacity: 0;
	transition: opacity 0.3s ease;
}

/* The teased slides either side sit shorter than the one in the middle,
   so the active room reads as the tallest thing in the band (BugHerd #22).
   Only the enhanced slider crops them — the no-JS row keeps one height. */
.vhc-slider.is-enhanced.cc-rooms__slider .splide__slide:not(.is-active) .cc-rooms__media img {
	aspect-ratio: 860 / 420;
}

/* Title and Reserve share a row; copy and "See all" share the next. */
.cc-rooms__head {
	align-items: center;
	display: flex;
	gap: 2rem;
	justify-content: space-between;
}

.cc-rooms__head .cc-rooms__title { margin: 0; }

.cc-rooms__head .wp-block-buttons { flex: none; }

.cc-rooms__detail > .cc-rooms__head { margin: 0 0 1.5rem; }

.cc-rooms__title {
	color: var(--wp--preset--color--pearl);
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--vhc-court-subhead-size, clamp(2rem, 3.3vw, 3rem));
	font-weight: 400;
	letter-spacing: var(--vhc-court-subhead-tracking, normal);
	line-height: var(--vhc-court-subhead-leading, 1.2);
	text-transform: var(--vhc-court-subhead-transform, none);
	margin: 0 0 1.5rem;
}

.cc-rooms__meta {
	align-items: flex-end;
	display: flex;
	gap: 2rem;
	justify-content: space-between;
}

.cc-rooms__copy {
	margin: 0;
	max-width: 520px;
}

.cc-rooms__meta .wp-block-buttons { flex: none; }

.cc-rooms__cta {
	display: flex;
	justify-content: flex-end;
	margin: 2rem auto 0;
	max-width: min(1380px, calc(100% - 3rem));
}

/* ─── Eat & drink ───────────────────────────────────────────────────── */
.cc-dining {
	padding: clamp(3.5rem, 7vw, 6rem) 0 clamp(3rem, 6vw, 5rem);
}

.cc-dining__kicker {
	justify-content: center;
	margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.cc-dining__feature {
	align-items: center;
	display: flex;
	gap: clamp(2rem, 6vw, 6rem);
	justify-content: center;
	margin: 0 auto clamp(3rem, 6vw, 5rem);
	max-width: min(1380px, calc(100% - 3rem));
}

.cc-dining__lines {
	display: flex;
	flex-direction: column;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--vhc-court-headline-size-dining, var(--wp--preset--font-size--x-large));
	font-weight: 400;
	letter-spacing: var(--vhc-court-headline-tracking, 0);
	line-height: var(--vhc-court-headline-leading, 1.15);
	margin: 0;
	text-align: center;
	text-transform: var(--vhc-court-headline-transform, none);
}

/* Texican #6/#7 — the stack had no width of its own, so it took whatever
   the flex row gave it (730px) and ran the longest line out full width.
   Bringing it in lets that line wrap and the four read as a centred block,
   the way the reference draws them. Scoped to Texican: the lines are
   different copy at a different size on each brand. */
body.is-court-texican .cc-dining__lines {
	max-width: 460px;
}

/* Texican #5 — 24px between a 39px room title and its 16px copy read as two
   separate things rather than one card. Halved. Scoped to Texican: this is
   a judgement about spacing rather than something measurably broken, and
   the other four are signed off at 24. */
body.is-court-texican .cc-rooms__slider .cc-rooms__title {
	margin-bottom: 0.75rem;
}

/* Texican #24's object-position rule lived here, pinning the cyclists photo
   to the foot of the wellness oval so the bikes cleared the ellipse. That
   photograph has gone: collection board #320 — "This is Cotton Court" — and
   it was, so the oval and the wellness hero now carry a Texican lobby shot
   instead. The rule was selected by filename precisely so it would travel
   with that photograph, which means it retires with it rather than silently
   framing a picture it was never measured against. The replacement is
   composed for the frame and needs no nudge. */

/* Cavalry #21 — "bump crop up to see more of rocking chair". The pair grid's
   landscape figure is 3:2 and this photograph is a 2:3 portrait, so the frame
   hides 778px of its 1400 and the chair's seat and rockers fell below the
   window. There is plenty of travel, so this one is a focal point rather than
   a re-cut: 75% spends it downward and holds the whole chair. Selected by
   filename so it stays with the photograph, not a position in the DOM. */
body.is-court-cavalry .cc-photoset__fig img[src*="cv-gal-v2"] {
	object-position: 50% 75%;
}

/* Idle lines rest in rose; the hovered/focused line inks to the band
   color and swaps the oval to its image (court.js). */
.cc-dining__line {
	color: var(--wp--preset--color--court-rose);
	cursor: pointer;
	font-size: inherit;
	margin: 0;
	transition: color 0.25s ease;
}

.cc-dining__line.is-active,
.cc-dining__line:hover,
.cc-dining__line:focus-visible {
	color: var(--vhc-court-dining-active, var(--wp--preset--color--court-band));
	outline: none;
}

/* Ornament oval: photos stack inside the frame's ellipse (the border
   overlay's cream corners + teeth sit on top, so images read through
   the ring exactly like the drawn composite). */
.cc-dining__oval {
	aspect-ratio: 540 / 694;
	flex: 0 0 min(540px, 44%);
	margin: 0;
	position: relative;
}

.cc-dining__oval-img {
	/* The photo covers the whole box; the ornament on top (opaque cream
	   surround + ring, the ::after) does the shaping. No clip-path or mask
	   — those drift from the drawing and behave differently across
	   browsers. */
	height: 100%;
	inset: 0;
	margin: 0;
	opacity: 0;
	position: absolute;
	transition: opacity 0.35s ease;
	width: 100%;
}

.cc-dining__oval-img img {
	border-radius: 0 !important;
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.cc-dining__oval-img.is-active {
	opacity: 1;
}

.cc-dining__oval::after {
	background: var(--vhc-court-oval-cream, url('assets/images/brands/caravan/oval-frame-cream.png')) no-repeat center / 100% 100%;
	content: '';
	/* 1px past the photo box so the frame's scaled edge row can't show
	   the photo as a hairline. */
	inset: -1px;
	pointer-events: none;
	position: absolute;
}

/* Texican #8 — the row was a hard four-column grid, so a property with
   fewer venues left its cards jammed against the left edge with empty
   columns beside them (Texican and Lone Star have two; Cotton and Cavalry
   have one). The cards keep the width a quarter-column would give them at
   any viewport, but the row now centres on whatever is actually there. */
.cc-dining__venues {
	--cc-venue-gap: clamp(1.5rem, 4vw, 4rem);
	display: grid;
	gap: var(--cc-venue-gap);
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, calc((100% - 3 * var(--cc-venue-gap)) / 4));
	justify-content: center;
	margin: 0 auto clamp(2.5rem, 5vw, 4rem);
	max-width: min(1380px, calc(100% - 3rem));
}

.cc-dining__venue figure {
	margin: 0 0 1.25rem;
}

.cc-dining__venue img {
	aspect-ratio: 284 / 383;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.wp-block-button.cc-dining__venue-link > .wp-block-button__link {
	color: var(--wp--preset--color--court-band);
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
}

.wp-block-button.cc-dining__venue-link > .wp-block-button__link:hover {
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

.cc-dining__cta {
	display: flex;
	justify-content: center;
}

/* ─── Packages band ─────────────────────────────────────────────────── */
.cc-packages {
	background: var(--wp--preset--color--court-maroon);
	color: var(--wp--preset--color--pearl);
}

.cc-packages > .cc-kicker,
.cc-rooms > .cc-kicker {
	margin-left: auto;
	margin-right: auto;
	max-width: min(1380px, calc(100% - 3rem));
}

.cc-packages__grid {
	align-items: start;
	display: grid;
	gap: clamp(1.5rem, 3vw, 2.5rem);
	grid-template-columns: 1fr 1.5fr 1fr;
	margin: 2.5rem auto 0;
	max-width: min(1380px, calc(100% - 3rem));
}

.cc-packages__card figure {
	margin: 0 0 1.5rem;
}

.cc-packages__card img {
	aspect-ratio: 345 / 423;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.cc-packages__card--feature img {
	aspect-ratio: 520 / 638;
}

/* "Treat yourself" centres over the cards (BugHerd #27). The star is a
   flex item of the eyebrow, so centring is justify-content, not
   text-align. */
.cc-packages > .cc-kicker {
	justify-content: center;
	text-align: center;
}

/* Cotton #4 — "bring letterspacing in". The offer titles set at `normal`
   while Cotton's own headlines run at -0.02em, so its Coconat read loose
   against everything around it. Its own slot rather than
   --vhc-court-headline-tracking, because that is POSITIVE on the others
   (Texican 0.03em, Cavalry 0.02em) and reusing it would have pushed their
   offer titles apart to tighten Cotton's. */
.cc-packages__title {
	color: var(--wp--preset--color--pearl);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.75rem, 2.6vw, 2.375rem);
	font-weight: 400;
	letter-spacing: var(--vhc-court-packages-tracking, normal);
	line-height: 1.2;
	margin: 0 0 0.875rem;
}

.cc-packages__title a {
	color: inherit;
	text-decoration: none;
}

.cc-packages__title a::after {
	background: currentColor;
	content: '';
	display: inline-block;
	height: 0.5em;
	margin-left: 0.625rem;
	-webkit-mask: var(--vhc-court-pager-arrow, url('assets/images/brands/caravan/pager-arrow.svg')) no-repeat center / contain;
	mask: var(--vhc-court-pager-arrow, url('assets/images/brands/caravan/pager-arrow.svg')) no-repeat center / contain;
	transition: transform 0.2s ease;
	width: 0.55em;
}

.cc-packages__title a:hover::after,
.cc-packages__title a:focus-visible::after {
	transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {
	.cc-packages__title a::after { transition: none; }
}

.cc-packages__copy {
	margin: 0;
	max-width: 520px;
}

/* ─── Meetings ──────────────────────────────────────────────────────── */
.cc-meetings {
	padding: clamp(3.5rem, 7vw, 6rem) 0;
}

.cc-meetings__mast {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

/* The mast already carries the flag, so its eyebrow drops the star —
   two marks stacked read as a mistake (BugHerd #30). The review card's
   eyebrow drops it too (BugHerd #32). */
.cc-meetings__mast .cc-kicker::before,
.cc-review__card .cc-kicker::before {
	display: none;
}

.cc-meetings__flag {
	display: var(--vhc-court-meetings-flag, block);
	margin: 0;
	width: 86px;
}

/* Texican #9 — "add stars above this; remove cactus". The Court style sheet
   draws the row at 12033:3135: 64 x 12 overall, three stars, so 14 wide at
   11px apart. Meg's reference crop agrees on the proportions and puts the
   row about 2.2 cap-heights above the eyebrow, which is the 1.5rem the mast
   already uses — so only the mark changes, not the spacing.

   Three mask layers of the brand's own star rather than a new asset, so it
   takes a colour rather than baking one, and stays the same shape as the
   stars on the eyebrows and subnav (#20/#27).

   Cotton #6 asks for the same swap and Cavalry #5 for the removal alone, so
   what was scoped to one body class is now two brand slots: the flag hides
   with --vhc-court-meetings-flag, the stars appear with
   --vhc-court-meetings-stars. Both default to the untouched arrangement, so
   a brand that sets neither is unaffected. court-maroon is a per-brand slot,
   so the row takes each property's own ink without naming a colour here. */
.cc-meetings__mast::before {
	background: var(--wp--preset--color--court-maroon);
	content: '';
	display: var(--vhc-court-meetings-stars, none);
	height: 12px;
	-webkit-mask:
		var(--vhc-court-meetings-star, var(--vhc-court-kicker-star)) no-repeat left center / 14px 12px,
		var(--vhc-court-meetings-star, var(--vhc-court-kicker-star)) no-repeat center center / 14px 12px,
		var(--vhc-court-meetings-star, var(--vhc-court-kicker-star)) no-repeat right center / 14px 12px;
	mask:
		var(--vhc-court-meetings-star, var(--vhc-court-kicker-star)) no-repeat left center / 14px 12px,
		var(--vhc-court-meetings-star, var(--vhc-court-kicker-star)) no-repeat center center / 14px 12px,
		var(--vhc-court-meetings-star, var(--vhc-court-kicker-star)) no-repeat right center / 14px 12px;
	width: 64px;
}

.cc-meetings__flag img {
	border-radius: 0 !important;
	display: block;
	height: auto;
	width: 100%;
}

.cc-meetings__row {
	align-items: center;
	display: flex;
	gap: clamp(2rem, 6vw, 6.5rem);
	justify-content: center;
	margin: 0 auto;
	max-width: min(1380px, calc(100% - 3rem));
}

.cc-meetings__oval {
	flex: 0 0 min(540px, 44%);
	margin: 0;
}

.cc-meetings__oval img {
	border-radius: 0 !important;
	display: block;
	height: auto;
	width: 100%;
}

.cc-meetings__detail {
	max-width: 366px;
}

.cc-meetings__head {
	color: var(--vhc-court-headline-color, inherit);
	font-size: var(--vhc-court-headline-size, var(--wp--preset--font-size--large));
	letter-spacing: var(--vhc-court-headline-tracking, normal);
	line-height: var(--vhc-court-headline-leading, 1.2);
	margin: 0 0 1.25rem;
	text-transform: var(--vhc-court-headline-transform, none);
}

.cc-meetings__copy {
	margin: 0 0 2rem;
}

/* ─── Review band ───────────────────────────────────────────────────── */
/* Texican #13 — the band read as oversized in the viewport (803px of a
   1046px window). The weight was air, not type: 80px of band padding either
   side of a card with another 78px of its own. Trimmed here rather than in
   the quote scale, which three brands pin deliberately. Card stays 980px so
   the quote keeps its line count. */
.cc-review {
	background-position: center bottom;
	background-size: cover;
	padding: clamp(2.5rem, 4vw, 3.5rem) 1.5rem;
}

.cc-review__card {
	align-items: center;
	background: var(--wp--preset--color--court-green);
	border-radius: 8px;
	color: var(--wp--preset--color--pearl);
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	margin: 0 auto;
	max-width: 980px;
	padding: clamp(2rem, 3.75vw, 3.25rem);
	text-align: center;
}

.cc-review__mark {
	/* Switchable per brand, the same way the kicker mark is: Texican's is a
	   cactus and its review asked for it gone (BugHerd #11). */
	display: var(--vhc-court-review-mark, block);
	margin: 0;
	width: 60px; /* #13 — was 73px */
}

.cc-review__mark img {
	border-radius: 0 !important;
	display: block;
	height: auto;
	width: 100%;
}

.cc-review__slider {
	width: 100%;
}

.cc-review__slider .splide__slide,
.cc-review__slide {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 1.5rem; /* #13 — was 1.75rem */
}

/* No-JS: the row stacks the quotes. */
.cc-review__slider .vhc-slider__row { flex-direction: column; overflow: visible; }

.cc-review__pager {
	margin: 0.25rem 0 0;
}

.cc-review--blue .cc-review__card {
	background: var(--wp--preset--color--court-blue-light);
}

.cc-review__stars {
	color: var(--wp--preset--color--golden-hour);
	font-size: 1.25rem;
	letter-spacing: 0.35em;
	margin: 0;
}

.cc-review--blue .cc-review__stars {
	color: var(--wp--preset--color--court-band);
}

/* Texican #12 — the quote face is per brand. Texican was on Combat, a heavy
   slab that has no typographic quote marks of its own, so the “ and ” fell
   back to Times inside the sentence; and the subhead's title-casing came
   with it. Meg's reference draws the quote in the brand's display face in
   sentence case, which is what brand_type_quote_family now selects. Unset
   keeps the serif the other four ship. */
.cc-review__quote,
.wp-block-quote.cc-review__quote {
	border: 0;
	color: var(--wp--preset--color--pearl);
	font-family: var(--vhc-court-quote-family, var(--wp--preset--font-family--serif));
	font-size: var(--vhc-court-quote-size, clamp(1.5rem, 2.8vw, 2.5rem));
	letter-spacing: var(--vhc-court-subhead-tracking, normal);
	line-height: var(--vhc-court-subhead-leading, 1.2);
	margin: 0;
	padding: 0;
	/* The quote follows the subhead face; brand_type_quote_transform lets a
	   title-case subhead brand keep its quotes in sentence case (Lone Star). */
	text-transform: var(--vhc-court-quote-transform, var(--vhc-court-subhead-transform, none));
}

.cc-review__quote p {
	font: inherit;
	margin: 0;
}

.cc-review__quote cite,
.cc-review__attr {
	display: block;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-style: normal;
	letter-spacing: 0.1em;
	line-height: 1.4;
	margin: 1.25rem 0 0; /* #13 — was 1.75rem */
	text-transform: uppercase;
}

/* ─── Rewards band ──────────────────────────────────────────────────── */
.cc-rewards {
	background: var(--wp--preset--color--court-blue-light);
	border-radius: 8px;
	color: var(--wp--preset--color--pearl);
	margin-bottom: clamp(3rem, 6vw, 5rem);
	/* Texican #15 — tripled, to show more of the offwhite above the band.
	   Each term is 3x the old clamp(1rem, 2vw, 2rem), so it triples at
	   every viewport rather than just the one it was measured at. */
	margin-top: clamp(3rem, 6vw, 6rem);
	padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 4vw, 3.5rem);
	text-align: center;
}

.cc-rewards--band {
	background: var(--wp--preset--color--court-band);
}

.cc-rewards__stacks {
	align-items: center;
	display: flex;
	gap: clamp(2rem, 6vw, 7rem);
	justify-content: center;
	margin-bottom: 2rem;
}

.cc-rewards__stack {
	color: var(--wp--preset--color--pearl);
	/* Equal flex shares either side of the art keep the art centred on the
	   band (and over the copy below) even though "join for free" is
	   narrower than "be rewarded forever". */
	flex: 1 1 0;
	font-family: var(--vhc-court-subhead-family, inherit);
	font-size: var(--vhc-court-subhead-size, var(--wp--preset--font-size--x-large));
	letter-spacing: var(--vhc-court-subhead-tracking, normal);
	line-height: var(--vhc-court-subhead-leading, 1.15);
	margin: 0;
	text-transform: var(--vhc-court-subhead-transform, lowercase);
}

/* Texican #14 — the two headings used to point inward at the art, ragged on
   their outer edge. Both centre now (the phone layout already did), so the
   pair reads as a matched set either side of the illustration. Equal flex
   shares still keep the art on the band's centre line. */
.cc-rewards__stack:first-child,
.cc-rewards__stack:last-child {
	text-align: center;
}

.cc-rewards__art {
	margin: 0;
	width: min(520px, 42%);
}

.cc-rewards__art img {
	border-radius: 0 !important;
	display: block;
	height: auto;
	width: 100%;
}

.cc-rewards__cta .wp-block-buttons { justify-content: center; }

.cc-rewards__copy {
	margin: 0 auto 2rem;
	max-width: 410px;
}

/* Instagram feed in court dress. */
body.is-brand-court .vhc-igfeed__kicker {
	align-items: center;
	display: flex;
	padding-right: max(1.5rem, calc((100vw - 1380px) / 2));
}

/* The eyebrow dot ::before is its own flex item, so push the handle
   right with an auto margin rather than space-between. */
body.is-brand-court .vhc-igfeed__handle {
	margin-left: auto;
}

/* The collection's golden dot gives way to the property's star, so the
   strip's label matches every other Court eyebrow (BugHerd #34). */
body.is-brand-court .vhc-igfeed__kicker.vhc-eyebrow--dot::before {
	/* The row is a flex container, so the vertical-align below never applied
	   — a flex item takes align-self. Same baseline fix as the other two
	   marks; this one sat 3.4px low on Lone Star. */
	align-self: baseline;
	background: currentColor;
	border-radius: 0;
	height: 12px;
	margin-right: 0.75rem;
	-webkit-mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	vertical-align: baseline;
	width: 14px;
}

body.is-brand-court .vhc-igfeed__glyph {
	display: inline-block;
	margin-right: 0.625rem;
	vertical-align: -0.3em;
}

body.is-brand-court .vhc-igfeed .vhc-slider.is-enhanced .splide__slide,
body.is-brand-court .vhc-igfeed .vhc-slider__row .vhc-igfeed__item {
	width: min(290px, 72vw);
}

body.is-brand-court .vhc-igfeed__item img {
	aspect-ratio: 290 / 404;
	border-radius: 8px;
}

@media (max-width: 981px) {
	.cc-dining__feature,
	.cc-meetings__row {
		flex-direction: column;
	}

	/* Back to rows of two below the desktop layout (#8 put the wide row on
	   grid-auto-flow: column, which would otherwise keep them all in one).
	   auto-fit collapses the unused track so a one-venue property centres
	   here as well, rather than sitting in the left half. */
	.cc-dining__venues {
		grid-auto-columns: auto;
		grid-auto-flow: row;
		grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - var(--cc-venue-gap)) / 2)));
		justify-content: center;
	}

	.cc-packages__grid {
		grid-template-columns: 1fr;
	}

	/* Phones: heading / art / heading in one centred column (a wrapped row
	   left the art beside the first heading and the second heading alone). */
	.cc-rewards__stacks {
		flex-direction: column;
		gap: 1.5rem;
	}

	.cc-rewards__stack,
	.cc-rewards__stack:first-child,
	.cc-rewards__stack:last-child {
		flex: 0 1 auto;
		text-align: center;
	}

	.cc-rewards__art {
		width: min(520px, 72%);
	}

	.cc-collage__field {
		aspect-ratio: auto;
		min-height: 60rem;
	}
}

/* A collage without medallion text: the slot geometry reserves the top
   ~21% of the field for the medallion, so pull the field up under the
   intro band instead of leaving that band empty (percent = field width). */
.cc-collage--bare {
	padding-top: 0;
}

.cc-collage--bare .cc-collage__field {
	margin-top: -17%;
}

/* ═══════════════════════════════════════════════════════════════════════
   Interior vocabulary — Court dress for the inner pages (the Riverwalk
   page architecture recomposed in cc-* sections). Every band pads to
   the 1380 container; tones recolor from the per-site palette presets.
   ═══════════════════════════════════════════════════════════════════════ */
body.is-brand-court {
	--valencia-header-height: 73px;
	--cc-pad: max(1.5rem, calc((100% - 1380px) / 2));
	--cc-band: clamp(3.5rem, 7vw, 6rem);
}

/* Section chassis */
.cc-intro,
.cc-list,
.cc-feature,
.cc-venues,
.cc-gallery,
.cc-accordion,
.cc-rfp,
.cc-offers,
.cc-actions,
.cc-roomlist,
.cc-map,
.cc-teasers,
.cc-contact,
.cc-legal,
.cc-cta {
	padding: var(--cc-band) var(--cc-pad);
}

/* Texican #25 — two bands of the same tone butt together into one
   uninterrupted field of colour, but each still paid a full band's padding,
   so the facing edges stacked into ~192px of dead space with no colour
   change to explain it. The second of a same-tone pair drops its top
   padding. 23 places network-wide, the intro-above-venues pair Meg pinned
   being one on each of the five Courts. */
.entry-content > [class*="--white"] + [class*="--white"],
.entry-content > [class*="--ground"] + [class*="--ground"] {
	padding-top: 0;
}

.cc-intro--white,
.cc-list--white,
.cc-feature--white,
.cc-venues--white,
.cc-gallery--white,
.cc-accordion--white,
.cc-rfp--white,
.cc-offers--white,
.cc-actions--white,
.cc-teasers--white {
	background: var(--wp--preset--color--white);
}

.cc-list--band,
.cc-feature--band,
.cc-gallery--band,
.cc-cta--band,
.cc-actions--band {
	background: var(--wp--preset--color--court-band);
	color: var(--wp--preset--color--pearl);
}

.cc-list--blue,
.cc-feature--blue,
.cc-gallery--blue,
.cc-cta--blue,
/* Cotton #7 — its rewards band was seeded on the Yellow band slot, but the
   comp puts it on Blue, and the band's own FPO caption has said so all
   along: "line art in ground on the blue band". */
.cc-rewards--blue {
	background: var(--wp--preset--color--court-blue-light);
	color: var(--wp--preset--color--pearl);
}

.cc-list--green,
.cc-gallery--green,
.cc-cta--green {
	background: var(--wp--preset--color--court-green);
	color: var(--wp--preset--color--pearl);
}

.cc-gallery--maroon,
.cc-cta--maroon {
	background: var(--wp--preset--color--court-maroon);
	color: var(--wp--preset--color--pearl);
}

/* Shared type roles */
.cc-display {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 1.08;
	text-transform: uppercase;
}

.cc-intro__head,
.cc-list__head,
.cc-feature__mast-head,
.cc-feature__title--display,
.cc-venues__head,
.cc-accordion__head,
.cc-rfp__head,
.cc-actions__head,
.cc-map__head,
.cc-contact__head,
.cc-legal__head,
.cc-cta__head,
.cc-photoset__label-head {
	/* Per-property type: the --vhc-court-headline-* vars come from the
	   brand_type_* options (printed by valencia_court_brand_css); a
	   property that sets none gets Caravan's values below. */
	color: var(--vhc-court-headline-color, var(--wp--preset--color--court-band));
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--vhc-court-headline-size, clamp(1.75rem, 3.2vw, 2.75rem));
	font-weight: 400;
	letter-spacing: var(--vhc-court-headline-tracking, 0.04em);
	line-height: var(--vhc-court-headline-leading, 1.1);
	margin: 0 0 1.25rem;
	text-transform: var(--vhc-court-headline-transform, uppercase);
}

.cc-intro__head em,
.cc-list__head em,
.cc-feature__title em,
.cc-feature__mast-head em,
.cc-venues__head em,
.cc-accordion__head em,
.cc-rfp__head em,
.cc-actions__head em,
.cc-map__head em,
.cc-contact__head em,
.cc-legal__head em,
.cc-cta__head em,
.cc-photoset__label-head em,
.cc-phero__title em {
	/* Hunter, 2026-09-20: the emphasised line reads as a faded second
	   tone in the rose tint — every headline line is now one shade. The
	   markup keeps its <em> so the two-tone can return by restoring
	   var(--wp--preset--color--court-rose) here. */
	color: inherit;
	font-style: normal;
}

.cc-list--band .cc-list__head,
.cc-list--blue .cc-list__head,
.cc-list--green .cc-list__head,
.cc-feature--band .cc-feature__title,
.cc-feature--band .cc-feature__mast-head,
.cc-feature--blue .cc-feature__title,
.cc-feature--blue .cc-feature__mast-head,
.cc-cta--band .cc-cta__head,
.cc-cta--blue .cc-cta__head,
.cc-cta--green .cc-cta__head,
.cc-cta--maroon .cc-cta__head,
.cc-actions--band .cc-actions__head {
	color: var(--wp--preset--color--pearl);
}

.cc-list--band .cc-list__head em,
.cc-list--blue .cc-list__head em,
.cc-cta--band .cc-cta__head em,
.cc-cta--blue .cc-cta__head em,
.cc-cta--green .cc-cta__head em,
.cc-cta--maroon .cc-cta__head em {
	/* Same call on the coloured sections (2026-09-20): the golden-hour
	   second line read as a faded tone, and on a Court whose band or
	   blue slot *is* golden-hour (Texican's meetings band, Cotton's CTAs)
	   it vanished into its own fill. Restore
	   var(--wp--preset--color--golden-hour) here for the two-tone. */
	color: inherit;
}

.cc-serif {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	line-height: 1.15;
}

.cc-kicker + .cc-intro__head,
.cc-kicker + .cc-list__head,
.cc-kicker + .cc-feature__title,
.cc-kicker + .cc-venues__head,
.cc-kicker + .cc-accordion__head,
.cc-kicker + .cc-rfp__head,
.cc-kicker + .cc-actions__head,
.cc-kicker + .cc-map__head,
.cc-kicker + .cc-contact__head,
.cc-kicker + .cc-legal__head,
.cc-kicker + .cc-cta__head,
.cc-kicker + .cc-feature__mast-head,
.cc-kicker + .cc-photoset__label-head {
	margin-top: 1.25rem;
}

.wp-block-buttons.cc-actions__row {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 1.75rem;
	margin-top: 1.75rem;
}

.cc-actions__row .is-style-cc-link > .wp-block-button__link { color: inherit; }

/* Grid helpers shared by the two-column bands */
.cc-intro__split,
.cc-list__grid,
.cc-rfp__intro,
.cc-map__intro,
.cc-contact__grid,
.cc-legal__intro,
.cc-cta__inner {
	display: grid;
	gap: 2.5rem clamp(2rem, 6vw, 6rem);
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

/* ─── Interior hero ─────────────────────────────────────────────────── */
.cc-phero .wp-block-cover__inner-container {
	height: 100%;
	position: static;
}

/* Texican #22/#23 — the interior heroes carried a 30% wash of `midnight`,
   which the Court palette remaps to each brand's darkest colour, so the
   photos were being tinted maroon on Texican, rust on Cotton and slate on
   Caravan. "The original isn't this colour" — quite right. The dim span
   stays in the markup and is simply not painted, so this is one line to
   put back and needs no content edit on ten pages across five properties.
   The home hero keeps its lighter 20%: it carries the wordmark.

   Specificity matters here: the core cover stylesheet dims with
   `.wp-block-cover .wp-block-cover__background.has-background-dim
   .has-background-dim-30`, four classes, so a three-class rule loses to it
   silently and the wash stays at 0.3 with nothing to show for it. */
body.is-brand-court .wp-block-cover.cc-phero > .wp-block-cover__background.has-background-dim {
	opacity: 0;
}

/* Texican #22/#23 — the scrim behind the interior hero's type.
   The 30% wash those tickets removed was `midnight`, which the Court palette
   remaps per brand, so it tinted the photographs (maroon on Texican, rust on
   Cotton, slate on Caravan). This is the opposite: pure black, confined to
   the bottom of the frame where the type sits, so the photograph's colour is
   untouched everywhere it is actually visible.

   It is not decoration. Cream type on an unprotected photograph measured as
   low as 1.00:1 against the white stucco on Dining and the pale wall on
   Rooms & Suites. WCAG 2.1 AA wants 4.5:1 for the eyebrow (16px, under the
   large-text threshold) and 3.0:1 for the title and script sub-line.

   RE-MEASURED 2026-10-01, the designer having called the old ramp too
   dramatic. It was: 30 text elements across 15 interior heroes on all five
   Courts, sampling the worst-lit block under each one on the bare
   photograph and solving for the least black alpha that still clears its
   own threshold. Headroom was large — most type sat at 9-13:1 against a
   3.0-4.5 requirement — and the peak only ever needs 0.55 (Caravan Rooms &
   Suites, the 16px eyebrow). It was set to 0.80.

   Two things fell out of the measurement and shaped the stops below:

   - Type occupies only 8-54% of the hero. The old ramp was still at 0.30
     at 60% and ran to 80%, darkening a third of the frame no type ever
     reaches. That part was pure weight for nothing, and it is now clear
     by 72%.
   - The old ramp decayed too fast through 50-60% and genuinely FAILED AA
     on Lone Star Rooms & Suites, whose eyebrow sits unusually high at 54%
     — 4.48:1 against the 4.5 it needs, measured on the rendered page, not
     predicted. So the band across the type is slightly FIRMER than before
     even as the peak drops. Lighter overall, correct where it counts.

   Worst margin over threshold across all 30 elements is now +0.05 alpha.
   Anything below about 0.60 at the peak starts failing real elements. */
/* The same job on the home hero, where the type is the two corner taglines
   rather than a headline block. They sit 16–19% up from the foot, so this
   ramp is tighter and is fully clear by 46% — the wordmark starts at 50%
   and must not be touched.

   Re-measured 2026-10-01 with the interior ramp. This one was the more
   over-built of the two: of the ten taglines across the five Courts, EIGHT
   need no scrim at all — they clear 3.0:1 on the bare photograph, by as
   much as 18:1. Only Cotton's second tagline (needs 0.14) and Lone Star's
   first (0.21) rely on it. At 0.58 the ramp was roughly three times what
   the worst case asks for. 0.34 keeps +0.11 of margin on that worst
   case. */
.cc-hero::after {
	background: linear-gradient(
		to top,
		rgba(0, 0, 0, 0.34) 0%,
		rgba(0, 0, 0, 0.32) 20%,
		rgba(0, 0, 0, 0.20) 30%,
		rgba(0, 0, 0, 0.07) 38%,
		rgba(0, 0, 0, 0) 46%
	);
	content: '';
	inset: 0;
	position: absolute;
	z-index: 0;
}

.cc-phero::after {
	background: linear-gradient(
		to top,
		rgba(0, 0, 0, 0.62) 0%,
		rgba(0, 0, 0, 0.60) 48%,
		rgba(0, 0, 0, 0.56) 56%,
		rgba(0, 0, 0, 0.26) 64%,
		rgba(0, 0, 0, 0.06) 70%,
		rgba(0, 0, 0, 0) 72%
	);
	content: '';
	inset: 0;
	position: absolute;
	z-index: 0;
}

.cc-phero--short { min-height: 62vh !important; }

.cc-phero__inner {
	bottom: clamp(3rem, 8vh, 6rem);
	color: var(--vhc-court-hero-art);
	left: clamp(1.5rem, 4vw, 3.75rem);
	max-width: min(900px, calc(100% - 3rem));
	position: absolute;
	z-index: 1;
}

.cc-phero__inner .cc-kicker--cream { color: var(--vhc-court-phero-kicker, var(--wp--preset--color--golden-hour)); }

/* Texican #19 — the condensed face carries a lot of air inside its em, so
   1.04 read as loose leading and 4.6vw read as small for a page title.
   Behind vars now so a brand can differ, but the value itself changes for
   every Court: unlike the quote scale, nothing had ever pinned this per
   brand — it was one shared default, which is the thing being adjusted. */
.cc-phero__title {
	color: var(--vhc-court-hero-art);
	/* Cavalry #9 wants Backout here and Lone Star #10 Mattone — which is the
	   same request twice: both are that brand's script/serif face rather than
	   its display face, so the option carries the preset and each brand
	   resolves its own. Cotton #9 asks for the lowercase cut, so the case is
	   a slot too. Unset on both = the display face in caps, as before. */
	font-family: var(--vhc-court-phero-family, var(--wp--preset--font-family--display));
	font-size: var(--vhc-court-phero-size, clamp(2.5rem, 5.6vw, 5.25rem));
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: var(--vhc-court-phero-leading, 0.92);
	margin: 1.25rem 0 0;
	text-transform: var(--vhc-court-phero-transform, uppercase);
}

.cc-phero__sub {
	color: var(--vhc-court-hero-art);
	font-family: var(--wp--preset--font-family--script);
	font-size: clamp(1.25rem, 2.2vw, 1.75rem);
	line-height: 1.3;
	margin: 1.25rem 0 0;
}

/* ─── Intro ─────────────────────────────────────────────────────────── */
.cc-intro--center .cc-intro__medallion {
	margin: 0 auto;
	max-width: 720px;
	text-align: center;
}

.cc-intro--center .cc-kicker { justify-content: center; }

.cc-intro__copy {
	margin: 0 0 1.25rem;
}

.cc-intro__copy:last-child { margin-bottom: 0; }

.cc-intro--center .cc-intro__copy { max-width: 620px; margin-left: auto; margin-right: auto; }

.wp-block-buttons.cc-intro__cta { margin-top: 2rem; }

.cc-intro--center .cc-intro__cta { justify-content: center; }

/* Texican #28/#29 — the split intro centres like the medallion one.
   Every cc-intro--split in the network is a page's first content band, so
   this is the "first component on the secondary pages" Meg asked for and
   the layout itself changes rather than a :first-child rule. Head and copy
   stack down the middle instead of sitting head-left / copy-right. */
.cc-intro--split .cc-intro__split {
	display: block;
	margin: 0 auto;
	max-width: 720px;
	text-align: center;
}

.cc-intro--split .cc-kicker { justify-content: center; }

/* The grid's row gap went with the grid. */
.cc-intro--split .cc-intro__body {
	margin-top: 2.5rem;
	max-width: 620px;
	margin-left: auto;
	margin-right: auto;
}

.cc-intro--split .cc-intro__cta { justify-content: center; }

/* ─── List band ─────────────────────────────────────────────────────── */
.cc-list__items {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cc-list__items--2 {
	column-gap: clamp(1.5rem, 4vw, 3rem);
	columns: 2;
}

.cc-list__items li {
	border-bottom: 1px solid currentColor;
	break-inside: avoid;
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.4;
	padding: 0.875rem 0;
	text-transform: uppercase;
}

.cc-list--ground .cc-list__items li,
.cc-list--white .cc-list__items li {
	border-color: var(--wp--preset--color--court-rose);
	color: var(--wp--preset--color--midnight);
}

.cc-list--band .cc-list__items li,
.cc-list--blue .cc-list__items li,
.cc-list--green .cc-list__items li {
	border-color: rgba(252, 249, 234, 0.4);
}

.cc-list__copy { margin: 0; max-width: 460px; }

/* ─── Feature stack ─────────────────────────────────────────────────── */
.cc-feature__mast {
	margin: 0 auto clamp(2.5rem, 5vw, 4rem);
	max-width: 720px;
	text-align: center;
}

.cc-feature__mast .cc-kicker { justify-content: center; }

/* Cavalry #11 — "can image top align with room name". The row centres its
   two columns, so the photograph floats against the text and its top sat
   104px below the room title. A brand slot rather than a change here: this
   row is every Court's rooms, business-travel, wellness and explore page,
   and four properties have already signed off on the centred version. */
.cc-feature__item {
	align-items: var(--vhc-court-feature-align, center);
	display: grid;
	gap: 2.5rem clamp(2rem, 6vw, 6rem);
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
}

.cc-feature__item + .cc-feature__item {
	margin-top: clamp(3rem, 7vw, 6rem);
}

.cc-feature__item--reverse .cc-feature__media { order: 2; }

/* BugHerd #576 — a reversed row swapped which column the media sits in but
   left the 5fr/6fr template alone, so the oval landed in the WIDE column
   and the copy in the narrow one. Two symptoms followed. Below ~1180px the
   oval rendered 480px wide against 425px on the rows either side of it
   (measured at the reporter's 1045px window: 480 vs 425). Above that width
   both hit the 480px cap, but the slack left in the wider column re-centred
   the oval, so it sat 113px inside the band's right edge while an
   un-reversed oval sat 54px inside the left.

   Mirroring the template puts the media column at 5fr on both sides: the
   two sizes match, and the insets mirror instead of differing by 59px.

   Caravan already carried a per-brand patch for the second symptom
   (margin-inline: auto 0); it is removed further down, since the slack it
   corrected no longer exists. Caravan gains the fix for the first symptom
   too — its reversed rows had been giving the copy 480px against 576px on
   the rows around them. */
.cc-feature__item--reverse {
	grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
}

.cc-feature__media {
	margin: 0;
}

.cc-feature__media img {
	aspect-ratio: 4 / 5;
	border-radius: 8px;
	display: block;
	height: auto;
	max-width: 540px;
	object-fit: cover;
	width: 100%;
}

.cc-feature__item--reverse .cc-feature__media img { margin-left: auto; }

/* Ornament oval — the homepage teeth frame around a portrait. */
.cc-feature__oval {
	aspect-ratio: 540 / 694;
	margin: 0 auto;
	max-width: 480px;
	position: relative;
	width: 100%;
}

/* Same composite as the homepage dining oval: the photo covers the whole
   box and the ornament on top does the shaping — its opaque surround is
   cream (oval-frame-cream.png) on ground bands and white (oval-frame-white.png)
   on white bands, chosen by the pattern. No clip-path or mask. */
.cc-feature__oval-img {
	height: 100%;
	inset: 0;
	margin: 0;
	position: absolute;
	width: 100%;
}

.cc-feature__oval-img img {
	aspect-ratio: auto !important;
	border-radius: 0 !important;
	display: block;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	width: 100% !important;
}

.cc-feature__oval::after {
	background: var(--vhc-court-oval-cream, url('assets/images/brands/caravan/oval-frame-cream.png')) no-repeat center / 100% 100%;
	content: '';
	inset: -1px;
	pointer-events: none;
	position: absolute;
}

.cc-feature--white .cc-feature__oval::after {
	background-image: var(--vhc-court-oval-white, url('assets/images/brands/caravan/oval-frame-white.png'));
}

.cc-feature__title {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(2rem, 3.4vw, 3rem);
	font-weight: 400;
	line-height: 1.12;
	margin: 0 0 1.25rem;
}

.cc-feature__copy {
	margin: 0 0 1.125rem;
	max-width: 560px;
}

.cc-feature__details {
	list-style: none;
	margin: 1.5rem 0 0;
	max-width: 560px;
	padding: 0;
}

.cc-feature__details li {
	border-top: 1px solid var(--wp--preset--color--court-rose);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	padding: 0.75rem 0;
	text-transform: uppercase;
}

.cc-feature__details li:last-child { border-bottom: 1px solid var(--wp--preset--color--court-rose); }

/* ─── Subnav ────────────────────────────────────────────────────────── */
.cc-subnav {
	background: var(--wp--preset--color--pearl);
	border-bottom: 1px solid var(--wp--preset--color--court-rose);
	position: sticky;
	top: var(--valencia-header-height);
	z-index: 40;
}

.wp-block-buttons.cc-subnav__inner {
	display: flex;
	flex-wrap: nowrap;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	justify-content: center;
	padding: 0 1.5rem;
}

.wp-block-button.is-style-cc-subnav > .wp-block-button__link {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--wp--preset--color--midnight);
	display: inline-flex;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 500;
	gap: 0.5rem;
	letter-spacing: 0.12em;
	line-height: 1.2;
	padding: 1.125rem 0;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
}

.wp-block-button.is-style-cc-subnav > .wp-block-button__link::before {
	background: currentColor;
	content: '';
	display: inline-block;
	flex: none;
	height: 10px;
	-webkit-mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	opacity: 0;
	transition: opacity 0.2s ease;
	width: 12px;
}

.wp-block-button.is-style-cc-subnav > .wp-block-button__link:hover,
.wp-block-button.is-style-cc-subnav.is-current > .wp-block-button__link {
	color: var(--wp--preset--color--court-band);
}

.wp-block-button.is-style-cc-subnav.is-current > .wp-block-button__link::before { opacity: 1; }

/* ─── Venues slider ─────────────────────────────────────────────────── */
.cc-venues__mast { margin-bottom: clamp(2rem, 4vw, 3.5rem); max-width: 720px; }

.cc-venues__copy { margin: 0; max-width: 560px; }

.cc-venues__layout {
	align-items: start;
	display: grid;
	gap: 2.5rem clamp(2rem, 5vw, 5rem);
	grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
}

.cc-venues__mast .cc-pager { margin-top: 1.5rem; }

/* Texican #26 — "feels floaty": the eyebrow and the 01/04 counter had
   nothing separating them from the venue sheets below. The rule goes on the
   layout rather than the mast because the mast is capped at 720px and the
   rule has to run the full width of the component (1366px here). The mast's
   own margin is halved so the pair reads as one gap with a line in it
   rather than two stacked gaps. court-rose is the hairline this component
   already uses for its spec lists. Scoped to Texican — a judgement about
   this property, like #5 and #7. */
body.is-court-texican .cc-venues__mast {
	margin-bottom: clamp(1rem, 2vw, 1.75rem);
}

body.is-court-texican .cc-venues__layout {
	border-top: 1px solid var(--wp--preset--color--court-rose);
	padding-top: clamp(1.5rem, 3vw, 2.5rem);
}

/* No-JS: venue sheets stack. */
.cc-venues__slider .vhc-slider__row { flex-direction: column; gap: 3rem; overflow: visible; }

.cc-venues__title {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(2rem, 3.4vw, 3rem);
	font-weight: 400;
	line-height: 1.1;
	margin: 0 0 1.5rem;
}

.cc-venues__desc { margin: 0 0 1.5rem; }

.cc-venues__specs { border-top: 1px solid var(--wp--preset--color--court-rose); }

.cc-venues__spec {
	border-bottom: 1px solid var(--wp--preset--color--court-rose);
	padding: 0.875rem 0;
}

.cc-venues__spec-label {
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	margin: 0 0 0.25rem;
	text-transform: uppercase;
}

.cc-venues__spec-value {
	color: var(--wp--preset--color--midnight-tint);
	margin: 0;
}

.cc-venues__chart,
.cc-venues__spec-value a {
	color: var(--wp--preset--color--court-band);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	margin-left: 0.75rem;
	text-transform: uppercase;
}

.cc-venues__media { margin: 0; }

.cc-venues__media img {
	aspect-ratio: 3 / 2;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

/* ─── Gallery strip ─────────────────────────────────────────────────── */
/* ─── Meeting room layouts (#474) ──────────────────────────────────────
   The client's own Social Tables exports: eight portrait line drawings on
   white. The existing cc-gallery is a Splide stage built for landscape
   photography, which is the wrong instrument — a planner wants to compare
   setups side by side, not page through them one at a time. So a plain
   grid, and each plan gets a white tile and a hairline so it reads as a
   drawing rather than floating on the band. */
.cc-layouts {
	padding-block: clamp(3rem, 6vw, 5rem);
}

.cc-layouts__note {
	margin: 0.75rem 0 0;
	max-width: 48ch;
}

.cc-layouts__grid {
	display: grid;
	gap: clamp(16px, 2vw, 28px);
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-top: clamp(1.75rem, 3vw, 2.5rem);
}

.cc-layouts__tile {
	margin: 0;
}

.cc-layouts__tile img {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.12);
	display: block;
	height: auto;
	width: 100%;
}

.cc-layouts__tile figcaption {
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	margin-top: 0.75rem;
	text-transform: uppercase;
}

@media (max-width: 1100px) {
	.cc-layouts__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

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

@media (max-width: 460px) {
	.cc-layouts__grid { grid-template-columns: minmax(0, 1fr); }
}

.cc-gallery {
	overflow: hidden;
	padding-left: 0;
	padding-right: 0;
}

.cc-gallery__bar {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin: 0 auto 2rem;
	max-width: min(1380px, calc(100% - 3rem));
}

/* The approved comp spacing came from the pager's paragraph margins. */
.cc-gallery__bar .cc-pager { margin: 1em 0; }

.cc-gallery__slider .splide__slide,
.vhc-slider.is-enhanced.cc-gallery__slider .splide__slide,
.cc-gallery__slider .vhc-slider__row > .cc-gallery__tile {
	flex: none;
	width: min(320px, 70vw);
}

.cc-gallery__tile { margin: 0; }

.cc-gallery__tile img {
	aspect-ratio: 290 / 404;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

/* ─── Photo sets (Gallery page) ─────────────────────────────────────── */
.cc-photoset { margin: var(--cc-band) auto; }

.cc-photoset--label { margin-bottom: clamp(2rem, 4vw, 3rem); text-align: center; }

.cc-photoset__label .cc-kicker { justify-content: center; }

.cc-photoset__grid {
	align-items: end;
	display: grid;
	gap: clamp(1.5rem, 4vw, 3.75rem);
}

.cc-photoset--pair .cc-photoset__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }

.cc-photoset--pair.cc-photoset--reverse .cc-photoset__fig--portrait { order: 2; }

.cc-photoset--row .cc-photoset__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.cc-photoset__fig { margin: 0; }

.cc-photoset__fig img {
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.cc-photoset__fig--portrait img { aspect-ratio: 4 / 5; }
.cc-photoset__fig--landscape img { aspect-ratio: 3 / 2; }
.cc-photoset--row .cc-photoset__fig img { aspect-ratio: 3 / 4; }

.cc-photoset--wide { padding: 0 var(--cc-pad); }

.cc-photoset__wide-wrap { position: relative; }

.cc-photoset__wide-tile { margin: 0; }

.cc-photoset__wide-tile img {
	aspect-ratio: 16 / 9;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.cc-photoset__arrow {
	background: none;
	border: 0;
	color: #fff;
	cursor: pointer;
	font-size: 1.5rem;
	padding: 1rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
}

.cc-photoset__arrow--prev { left: 0.5rem; }
.cc-photoset__arrow--next { right: 0.5rem; }
.cc-photoset__arrow--prev::before { content: '\2190'; }
.cc-photoset__arrow--next::before { content: '\2192'; }

.cc-photoset__progress {
	background: var(--wp--preset--color--court-rose);
	height: 2px;
	margin: 1.5rem auto 0;
	max-width: 240px;
	overflow: hidden;
}

.cc-photoset__progress span {
	background: var(--wp--preset--color--court-band);
	display: block;
	height: 100%;
	transition: transform 0.4s ease;
	width: 100%;
}

/* ─── Accordion ─────────────────────────────────────────────────────── */
.cc-accordion__intro {
	margin: 0 auto clamp(2rem, 4vw, 3.5rem);
	max-width: 860px;
}

.cc-accordion__copy { margin: 0; max-width: 620px; }

.cc-accordion__group {
	color: var(--wp--preset--color--court-band);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	margin: clamp(2rem, 4vw, 3rem) auto 0.75rem;
	max-width: 860px;
	text-transform: uppercase;
}

.wp-block-details.cc-accordion__item {
	border-bottom: 1px solid var(--wp--preset--color--court-rose);
	margin: 0 auto;
	max-width: 860px;
	padding: 0;
}

.wp-block-details.cc-accordion__item:first-of-type,
.cc-accordion__group + .wp-block-details.cc-accordion__item {
	border-top: 1px solid var(--wp--preset--color--court-rose);
}

.cc-accordion__item summary {
	align-items: baseline;
	color: var(--wp--preset--color--court-band);
	cursor: pointer;
	display: flex;
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.375rem, 2.2vw, 1.875rem);
	gap: 1.25rem;
	line-height: 1.2;
	list-style: none;
	padding: 1.25rem 0;
}

.cc-accordion__item summary::-webkit-details-marker { display: none; }

/* Row number (CSS counter across the whole section) and the +/− mark. */
.cc-accordion { counter-reset: cc-question; }

.cc-accordion__item summary::before {
	color: var(--wp--preset--color--midnight-tint);
	content: counter(cc-question, decimal-leading-zero);
	counter-increment: cc-question;
	flex: none;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	min-width: 2rem;
}

.cc-accordion--plain .cc-accordion__item summary::before { display: none; }

.cc-accordion__item summary::after {
	color: var(--wp--preset--color--midnight);
	content: '+';
	flex: none;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1.25rem;
	line-height: 1;
	margin-left: auto;
}

.cc-accordion__item[open] summary::after { content: '\2212'; }

/* content-box against the parent theme's global reset, deliberately. The
   padding-left aligns the copy under the summary's marker, and the 640px is a
   reading measure for the copy itself — under border-box the 52px indent comes
   out of that measure instead of sitting beside it, taking the copy to 588 and
   rewrapping it on four Court pages (offers, rewards, rooms-suites, and
   Cotton's rooms-suites). Keeping the number meaning what it says also means a
   change to the indent does not silently reflow the copy. */
.cc-accordion__item > p {
	box-sizing: content-box;
	margin: 0 0 1rem;
	max-width: 640px;
	padding-left: calc(2rem + 1.25rem);
}

.cc-accordion__item > p:last-child { padding-bottom: 1.25rem; }

.cc-accordion__item .cc-accordion__lead {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.25rem;
}

.cc-accordion__after {
	margin: clamp(2rem, 4vw, 3rem) auto 0;
	max-width: 860px;
}

.cc-accordion__footer { margin: 0; }

/* ─── RFP / form band ───────────────────────────────────────────────── */
.cc-rfp__intro { margin-bottom: clamp(2rem, 4vw, 3.5rem); }

.cc-rfp__lead {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.375rem, 2vw, 1.75rem);
	line-height: 1.3;
	margin: 0;
	max-width: 560px;
}

/* Gravity Forms in Court dress: mono labels, ink underline fields,
   keyline submit. Beats the parent's !important-laden GF mechanism with
   the same specificity ladder. */
body.is-brand-court .vhc-gform .gform_wrapper .gfield_label {
	color: var(--wp--preset--color--midnight) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
}

body.is-brand-court .vhc-gform .gform_wrapper .gfield_required {
	color: var(--wp--preset--color--court-band) !important;
}

body.is-brand-court .vhc-gform .gform_wrapper input[type='text'],
body.is-brand-court .vhc-gform .gform_wrapper input[type='email'],
body.is-brand-court .vhc-gform .gform_wrapper input[type='tel'],
body.is-brand-court .vhc-gform .gform_wrapper textarea {
	background: transparent !important;
	border-color: var(--wp--preset--color--midnight) !important;
	color: var(--wp--preset--color--midnight) !important;
	font-family: var(--wp--preset--font-family--body) !important;
}

body.is-brand-court .vhc-gform .gform_wrapper .gform_footer input[type='submit'],
body.is-brand-court .vhc-gform .gform_wrapper .gform_footer button {
	background: transparent !important;
	border: 2px solid var(--wp--preset--color--court-band) !important;
	color: var(--wp--preset--color--court-band) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.1em !important;
	padding: 0.875rem 1.5rem !important;
	text-transform: uppercase !important;
}

body.is-brand-court .vhc-gform .gform_wrapper .gform_footer input[type='submit']:hover,
body.is-brand-court .vhc-gform .gform_wrapper .gform_footer button:hover {
	background: var(--wp--preset--color--court-band) !important;
	color: var(--wp--preset--color--pearl) !important;
}

body.is-brand-court .vhc-gform .gform_wrapper .gform_validation_errors,
body.is-brand-court .vhc-gform .gform_wrapper .gfield_validation_message {
	color: var(--wp--preset--color--court-band) !important;
	font-family: var(--wp--preset--font-family--body) !important;
}

.cc-rfp__note {
	color: var(--wp--preset--color--midnight-tint);
	margin: 0;
}

.cc-rfp__form--static .cc-rfp__grid {
	display: grid;
	gap: 1.5rem 2rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cc-rfp__form--static label { display: block; }
.cc-rfp__form--static label span {
	display: block;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	margin-bottom: 0.5rem;
	text-transform: uppercase;
}
.cc-rfp__form--static input,
.cc-rfp__form--static textarea {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--midnight);
	font: inherit;
	padding: 0.5rem 0;
	width: 100%;
}
.cc-rfp__form--static .cc-rfp__field--wide { grid-column: 1 / -1; }

/* ─── Offers detail ─────────────────────────────────────────────────── */
.cc-offers__mast { margin-bottom: clamp(2rem, 4vw, 3.5rem); }

.cc-offers__item {
	align-items: center;
	display: grid;
	gap: 2.5rem clamp(2rem, 6vw, 6rem);
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	scroll-margin-top: calc(var(--valencia-header-height) + 1.5rem);
}

.cc-offers__item + .cc-offers__item {
	border-top: 1px solid var(--wp--preset--color--court-rose);
	margin-top: clamp(3rem, 6vw, 5rem);
	padding-top: clamp(3rem, 6vw, 5rem);
}

.cc-offers__item--reverse .cc-offers__media { order: 2; }

.cc-offers__media { margin: 0; }

.cc-offers__media img {
	aspect-ratio: 4 / 5;
	border-radius: 8px;
	display: block;
	height: auto;
	max-width: 520px;
	object-fit: cover;
	width: 100%;
}

.cc-offers__item--reverse .cc-offers__media img { margin-left: auto; }

.cc-offers__title {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(2rem, 3.4vw, 3rem);
	font-weight: 400;
	line-height: 1.1;
	margin: 0 0 1.25rem;
}

.cc-offers__copy { margin: 0 0 1.125rem; max-width: 560px; }

/* ─── Actions band ──────────────────────────────────────────────────── */
.cc-actions__inner { max-width: 720px; }

.cc-actions--center .cc-actions__inner { margin: 0 auto; text-align: center; }

.cc-actions--center .cc-kicker,
.cc-actions--center .cc-actions__row { justify-content: center; }

.cc-actions__copy { margin: 0; }

/* ─── Rooms list (parent rooms-grid block in Court dress) ───────────── */
.cc-roomlist .vhc-rooms-grid {
	margin: 0 auto;
	max-width: none;
	width: 100%;
}

body.is-brand-court .vhc-rooms-grid__bar {
	align-items: center;
	border-bottom: 1px solid var(--wp--preset--color--court-rose);
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	justify-content: space-between;
	margin-bottom: clamp(2rem, 4vw, 3rem);
	padding-bottom: 1.25rem;
}

body.is-brand-court .vhc-rooms-grid .is-style-eyebrow,
body.is-brand-court .vhc-rooms-grid__subkicker {
	align-items: center;
	color: var(--wp--preset--color--court-band);
	display: flex;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	font-weight: 600;
	gap: 0.625rem;
	letter-spacing: 0.1em;
	margin: 0;
	text-transform: uppercase;
}

/* Cavalry #10 — "remove icon". This star is NOT governed by
   --vhc-court-kicker-mark, deliberately: Texican runs kicker_mark: none and
   Meg's own #46 asked for this one to sit closer to its label rather than to
   go, so the rooms bar keeps its mark on a brand that has switched the
   others off. Its own slot, defaulting to shown. */
body.is-brand-court .vhc-rooms-grid .vhc-eyebrow--dot::before,
body.is-brand-court .vhc-rooms-grid__subkicker::before {
	/* Same baseline reasoning as .cc-kicker::before above — this mark is the
	   same star on the rooms bar. */
	align-self: baseline;
	background: currentColor;
	border-radius: 0;
	content: '';
	display: var(--vhc-court-rooms-mark, inline-block);
	height: 12px;
	/* The parent's golden dot carries a 1.25rem margin that stacked on top
	   of the row's own gap, so this star sat three times further from its
	   label than every other Court kicker (BugHerd #46). The gap alone
	   spaces it now. */
	margin-right: 0;
	-webkit-mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	mask: var(--vhc-court-kicker-star, url('assets/images/brands/caravan/kicker-star.svg')) no-repeat center / contain;
	width: 14px;
}

/* "Accessible Rooms" gets the bar's rule so the two group headings read
   the same way down the page (BugHerd #49). */
body.is-brand-court .vhc-rooms-grid .vhc-rooms-grid__subkicker {
	border-bottom: 1px solid var(--wp--preset--color--court-rose);
	margin: clamp(2.5rem, 5vw, 4rem) 0 clamp(2rem, 4vw, 3rem);
	padding-bottom: 1.25rem;
}

body.is-brand-court .vhc-rooms-grid__filters { display: flex; gap: 1.75rem; }

/* The parent draws these as a solid triangle, which reads as a dash at
   this size; Court wants a drawn caret in the label's own weight
   (BugHerd #48). Two borders rotated, so it inherits colour and scales. */
body.is-brand-court .vhc-rooms-grid__chevron {
	border: solid currentColor;
	border-width: 0 1.5px 1.5px 0;
	height: 6px;
	margin-bottom: 2px;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	width: 6px;
}

body.is-brand-court .vhc-rooms-grid__filter > button[aria-expanded='true'] .vhc-rooms-grid__chevron {
	margin-bottom: -2px;
	transform: rotate(-135deg);
}

@media (prefers-reduced-motion: reduce) {
	body.is-brand-court .vhc-rooms-grid__chevron { transition: none; }
}

body.is-brand-court .vhc-rooms-grid__filter > button {
	background: none;
	border: 0;
	color: var(--wp--preset--color--court-band);
	cursor: pointer;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	padding: 0;
	text-transform: uppercase;
}

body.is-brand-court .vhc-rooms-grid__filter ul {
	background: var(--wp--preset--color--pearl);
	border: 1px solid var(--wp--preset--color--court-rose);
	border-radius: 8px;
	font-family: var(--wp--preset--font-family--body);
}

body.is-brand-court .vhc-rooms-grid__filter ul button {
	color: var(--wp--preset--color--midnight);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body.is-brand-court .vhc-rooms-grid__chevron { border-color: var(--wp--preset--color--court-band); }

body.is-brand-court .vhc-rooms-grid__items {
	display: grid;
	gap: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 2.5vw, 2rem);
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.is-brand-court .vhc-room-card {
	display: flex;
	flex-direction: column;
}

body.is-brand-court .vhc-room-card__media,
body.is-brand-court .vhc-room-card__slider { margin: 0 0 1.5rem; }

body.is-brand-court .vhc-room-card__media img,
body.is-brand-court .vhc-room-card__slider img {
	aspect-ratio: 4 / 3;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

body.is-brand-court .vhc-room-card__name {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.5rem, 2.2vw, 1.875rem);
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.15;
	margin: 0 0 0.875rem;
	text-transform: none;
}

body.is-brand-court .vhc-room-card__desc {
	color: var(--wp--preset--color--midnight);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.9375rem;
	margin-bottom: 1.25rem;
}

body.is-brand-court .vhc-room-card__desc p { margin: 0 0 0.75rem; }

body.is-brand-court .vhc-room-card .vhc-hbtn {
	align-self: flex-start;
	border: 2px solid var(--wp--preset--color--court-band);
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	margin-top: auto;
	padding: 0.75rem 1.25rem;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 0.25s ease, color 0.25s ease;
}

body.is-brand-court .vhc-room-card .vhc-hbtn::after { content: none; }

body.is-brand-court .vhc-room-card .vhc-hbtn:hover {
	background: var(--wp--preset--color--court-band);
	color: var(--wp--preset--color--pearl);
}

/* ─── Map (parent explore-map block in Court dress) ─────────────────── */
.cc-map__intro { margin-bottom: clamp(2rem, 4vw, 3.5rem); }

.cc-map__copy { margin: 0 0 1.125rem; max-width: 620px; }

.cc-map .vhc-exmap { max-width: none; width: 100%; }

body.is-brand-court .vhc-exmap__cat {
	color: var(--wp--preset--color--midnight);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.is-brand-court .vhc-exmap__dot { border-color: var(--wp--preset--color--court-band); }

body.is-brand-court .vhc-exmap__cat.is-active,
body.is-brand-court .vhc-exmap__cat:hover { color: var(--wp--preset--color--court-band); }

body.is-brand-court .vhc-exmap__cat.is-active .vhc-exmap__dot {
	background: var(--wp--preset--color--court-band);
	border-color: var(--wp--preset--color--court-band);
}

body.is-brand-court .vhc-exmap__map,
body.is-brand-court .vhc-exmap__canvas {
	border-radius: 8px;
	overflow: hidden;
}

/* ─── Teasers ───────────────────────────────────────────────────────── */
.cc-teasers__mast { margin-bottom: clamp(2rem, 4vw, 3rem); }

.cc-teasers__grid {
	display: grid;
	gap: clamp(1.5rem, 4vw, 3.75rem);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cc-teasers__media {
	display: block;
	margin: 0 0 1.5rem;
}

.cc-teasers__media a { display: block; }

.cc-teasers__media img {
	aspect-ratio: 4 / 3;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	transition: transform 0.4s ease;
	width: 100%;
}

.cc-teasers__media:hover img { transform: scale(1.02); }

.cc-teasers__title {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.75rem, 2.6vw, 2.25rem);
	font-weight: 400;
	line-height: 1.15;
	margin: 0 0 0.75rem;
}

.cc-teasers__copy { margin: 0 0 1.25rem; max-width: 460px; }

/* ─── Contact ───────────────────────────────────────────────────────── */
.cc-contact__lead {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.25rem, 1.9vw, 1.625rem);
	line-height: 1.35;
	margin: 0;
	max-width: 520px;
}

.cc-contact__detail { padding-top: 0.5rem; }

.cc-contact__address {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.5rem, 2.2vw, 1.875rem);
	line-height: 1.25;
	margin: 0 0 1.5rem;
}

.cc-contact__lines {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
}

.cc-contact__lines li {
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	padding: 0.25rem 0;
	text-transform: uppercase;
}

.wp-block-buttons.cc-contact__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1.75rem;
}

.cc-contact__media { margin: clamp(2.5rem, 5vw, 4rem) 0 0; }

.cc-contact__media img {
	aspect-ratio: 21 / 9;
	border-radius: 8px;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.cc-contact + .cc-rfp { padding-top: 0; }

/* ─── Legal / prose ─────────────────────────────────────────────────── */
.cc-legal__intro { margin-bottom: clamp(2rem, 4vw, 3.5rem); }

.cc-legal__lead {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.25rem, 1.9vw, 1.625rem);
	line-height: 1.35;
	margin: 0 0 1.25rem;
	max-width: 600px;
}

.cc-legal__lead:last-child { margin-bottom: 0; }

.cc-legal__sections {
	margin-left: auto;
	max-width: 760px;
}

.cc-legal__section + .cc-legal__section { margin-top: 2.5rem; }

.cc-legal__section-head {
	color: var(--wp--preset--color--court-band);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	margin: 0 0 1rem;
	text-transform: uppercase;
}

.cc-legal__section p { margin: 0 0 1rem; }

.cc-legal__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cc-legal__list li {
	border-top: 1px solid var(--wp--preset--color--court-rose);
	padding: 0.875rem 0;
}

.cc-legal__list li:last-child { border-bottom: 1px solid var(--wp--preset--color--court-rose); }

.cc-legal .cc-actions__row { margin-left: auto; max-width: 760px; }

/* ─── CTA band ──────────────────────────────────────────────────────── */
.cc-cta__inner { align-items: center; }

.cc-cta__copy { margin: 0; max-width: 560px; }

.cc-cta--ground .cc-cta__copy,
.cc-cta--ground .cc-cta__head { color: var(--wp--preset--color--court-band); }

.cc-cta--band .cc-cta__copy,
.cc-cta--blue .cc-cta__copy,
.cc-cta--green .cc-cta__copy,
.cc-cta--maroon .cc-cta__copy { color: var(--wp--preset--color--pearl); }

/* ─── Responsive ────────────────────────────────────────────────────── */
@media (max-width: 981px) {
	.cc-intro__split,
	.cc-list__grid,
	.cc-rfp__intro,
	.cc-map__intro,
	.cc-contact__grid,
	.cc-legal__intro,
	.cc-cta__inner,
	.cc-feature__item,
	/* Carries more specificity than .cc-feature__item since #576, so it has
	   to be named here or a reversed row would keep its two columns on a
	   phone while every row around it stacked. */
	.cc-feature__item--reverse,
	.cc-venues__layout,
	.cc-offers__item,
	.cc-teasers__grid,
	.cc-photoset--pair .cc-photoset__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.cc-feature__item--reverse .cc-feature__media,
	.cc-offers__item--reverse .cc-offers__media,
	.cc-photoset--pair.cc-photoset--reverse .cc-photoset__fig--portrait { order: 0; }

	.cc-feature__item--reverse .cc-feature__media img,
	.cc-offers__item--reverse .cc-offers__media img { margin-left: 0; }

	.cc-venues__media { order: -1; }

	.cc-list__items--2 { columns: 1; }

	.cc-photoset--row .cc-photoset__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	body.is-brand-court .vhc-rooms-grid__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.cc-legal__sections { margin-left: 0; }

	.wp-block-buttons.cc-subnav__inner { gap: 1.25rem; justify-content: flex-start; overflow-x: auto; }

	.cc-accordion__item > p { padding-left: 0; }
}

@media (max-width: 640px) {
	.cc-photoset--row .cc-photoset__grid,
	body.is-brand-court .vhc-rooms-grid__items { grid-template-columns: minmax(0, 1fr); }

	.cc-rfp__form--static .cc-rfp__grid { grid-template-columns: minmax(0, 1fr); }

	body.is-brand-court .vhc-rooms-grid__filters { flex-wrap: wrap; gap: 1rem; }

	.cc-phero__inner { left: 1.5rem; right: 1.5rem; }
}

/* Footer seam: the parent gives the footer a 120px top margin, which reads
   as a stray cream strip after a toned closing band. Court pages carry the
   air inside the content instead, and drop it when the page closes on a
   colored or white section. */
body.is-brand-court.page .site-footer { margin-top: 0; }
body.is-brand-court.page .entry-content { padding-bottom: 120px; }
body.is-brand-court.page .entry-content:has(> :last-child.cc-cta),
body.is-brand-court.page .entry-content:has(> :last-child.cc-packages),
body.is-brand-court.page .entry-content:has(> :last-child.cc-list--band),
body.is-brand-court.page .entry-content:has(> :last-child.cc-list--blue),
body.is-brand-court.page .entry-content:has(> :last-child.cc-list--green),
body.is-brand-court.page .entry-content:has(> :last-child.cc-list--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-feature--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-feature--band),
body.is-brand-court.page .entry-content:has(> :last-child.cc-accordion--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-teasers--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-actions--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-offers--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-venues--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-gallery--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-gallery--band),
body.is-brand-court.page .entry-content:has(> :last-child.cc-rfp--white),
body.is-brand-court.page .entry-content:has(> :last-child.cc-intro--white) {
	padding-bottom: 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   Caravan Court — per-property treatments
   Scoped with the is-court-<slug> body class, for the calls that the
   palette, font and brand_type_* options can't express. The other Courts
   keep the shared defaults until their own review asks otherwise.
   ═══════════════════════════════════════════════════════════════════════ */

/* The centered intro's medallion loses its star (BugHerd #44) and goes
   maroon throughout (#45) — kicker, headline and copy, since the headline
   and kicker both set a colour of their own and would not inherit. */
body.is-court-caravan .cc-intro--center .cc-intro__medallion,
body.is-court-caravan .cc-intro--center .cc-intro__medallion .cc-intro__head,
body.is-court-caravan .cc-intro--center .cc-intro__medallion .cc-intro__head em,
body.is-court-caravan .cc-intro--center .cc-intro__medallion .cc-kicker {
	color: var(--wp--preset--color--court-maroon);
}

body.is-court-caravan .cc-intro--center .cc-intro__medallion .cc-kicker::before,
body.is-court-caravan .cc-feature__body .cc-kicker::before {
	display: none;
}

/* The rewards headings take the property's display face at the comp's
   40px (Figma 6345:9506/9507) — they were inheriting the body mono at the
   shared subhead size. Scoped rather than changing that var's fallback,
   which the room titles read too. The phone size is set further down. */
body.is-court-caravan .cc-rewards__stack {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.75rem, 3vw, 2.5rem);
}

/* The oval is capped at 480px and centred in its column, so it sat inset
   while the reversed items' copy ran to the band's edge — the two never
   lined up (BugHerd #56). Capping the row at the width where its first
   column is exactly the oval's keeps the photo flush with its column, so
   copy, photo and band edge share one line at every viewport; below that
   width the column is already under 480 and the cap stops binding. */
body.is-court-caravan .cc-feature__item {
	margin-inline: auto;
	max-width: calc(480px * 11 / 5 + clamp(2rem, 6vw, 6rem));
}

/* Offers: the photo and its copy sat a full 6rem apart (BugHerd #69). */
body.is-court-caravan .cc-offers__item {
	gap: 2.5rem clamp(1.5rem, 3vw, 3rem);
}

/* The RFP ran the full 1380 content column, so the fields stretched the
   width of the page; Meg asked for roughly triple the side margin
   (BugHerd #63). 840px puts the gutter at 3x its old value on a 1650
   viewport and simply stops binding once the screen is narrower. */
body.is-court-caravan .cc-rfp__intro,
body.is-court-caravan .cc-rfp__form {
	margin-inline: auto;
	max-width: 840px;
}

/* A reversed row used to put the oval in the WIDER column, where the 480px
   cap left slack and re-centred it, so Caravan pulled it to that column's
   outer edge to line the rows up. #576 fixed the cause for every Court by
   mirroring the grid template, which leaves no slack to correct — and the
   patch did still bite between 782px and 981px, where the band is stacked
   and every other oval is centred in the full column: Caravan's reversed
   ovals alone sat hard right (inset 0 against 127). Removed. */

/* ═══════════════════════════════════════════════════════════════════════
   Caravan Court — phones (BugHerd #88–#104, filed at 319–430px)
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 640px) {

	/* #101 A wider gutter on the interior pages; the home page keeps its
	   own rhythm. --cc-pad resolves to its 1.5rem floor at this width. */
	body.is-court-caravan:not(.home) {
		--cc-pad: 2rem;
	}

	/* #88 The hero tag is one line on a phone — the copy carries a <br>
	   for the desktop lockup, which is the only thing breaking it. */
	body.is-court-caravan .cc-hero__tag br {
		display: none;
	}

	/* #89 Twice the air between the hero film and the headline under it. */
	body.is-court-caravan .cc-collage {
		padding-top: 4rem;
	}

	/* #90 The collage is an absolutely-placed field with the medallion
	   floated over it, which puts photos across the copy on a narrow
	   screen. On phones the medallion returns to the flow — and since it
	   follows the field in the markup, the section becomes a column and
	   orders it first, so the layered images sit below the type. */
	body.is-court-caravan .cc-collage {
		display: flex;
		flex-direction: column;
	}

	body.is-court-caravan .cc-collage__medallion {
		left: auto;
		margin: 0 auto;
		max-width: none;
		order: -1;
		position: static;
		top: auto;
		transform: none;
		width: 100%;
	}

	/* The slot tops are percentages that reserve the top fifth of the
	   field for the medallion it no longer holds, so pull the field up
	   under the copy — the same trick .cc-collage--bare uses. */
	body.is-court-caravan .cc-collage__field {
		margin-top: -14%;
		min-height: 30rem;
	}

	/* #91 The headline was set at the desktop large size.

	   #116: it also ran the full width of the phone — measured 0..393 in a
	   393px window, touching both edges, because the medallion goes
	   width:100% here and nothing gave it a gutter. It takes the page's own
	   gutter now, and the type scales to stay on one line inside it
	   ("a glorious second act" is 393px of type at 24px, so ~5vw keeps it
	   within the gutters down to 319). Capped at the 1.5rem #91 set. */
	body.is-court-caravan .cc-collage__medallion {
		padding-inline: var(--cc-pad, 1.5rem);
	}

	body.is-court-caravan .cc-collage__head {
		font-size: min(1.5rem, 5vw);
	}

	/* #92 Rooms: no pager count, and the whole band centres — kicker,
	   photo, then the room name and copy beneath it. */
	body.is-court-caravan .cc-rooms__bar {
		flex-direction: column;
		gap: 0.75rem;
		justify-content: center;
	}

	body.is-court-caravan .cc-rooms__bar .cc-kicker,
	body.is-court-caravan .cc-rooms__bar .cc-pager {
		justify-content: center;
	}

	body.is-court-caravan .cc-rooms__bar .cc-pager__count {
		display: none;
	}

	/* Every Court, not just Caravan (Texican #45). Left as a row, the copy
	   and the "see all" link share a 345px line and the copy collapses to
	   under 100px — one or two words per line. Caravan had this fix from
	   its own mobile pass; the other four were still squeezed. */
	.cc-rooms__head,
	.cc-rooms__meta {
		align-items: center;
		flex-direction: column;
		gap: 1rem;
		text-align: center;
	}

	/* #93 / #94 Eat & drink: the framed photo leads, then the lines — and
	   they step down a size so each holds one line. The oval's flex basis
	   is a main-axis value, which is height once the feature is a column,
	   so it needs a width of its own here. */
	/* Every Court, not just Caravan (Texican #46). Without a width of its
	   own the oval measured 0x0 on the other four, so the framed photo
	   simply was not there — Texican, Cotton, Cavalry and Lone Star all
	   showed an empty band. */
	.cc-dining__oval {
		flex: none;
		margin: 0 auto 2rem;
		order: -1;
		width: min(280px, 72%);
	}

	body.is-court-caravan .cc-dining__line {
		font-size: 1.375rem;
	}

	/* #95 / #96 Venues and packages swipe rather than stack. */
	body.is-court-caravan .cc-dining__venues,
	body.is-court-caravan .cc-packages__grid {
		display: flex;
		gap: 1rem;
		grid-template-columns: none;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	/* .cc-dining__venues's base (grid) rule centers its content with
	   justify-content: center — fine for a grid that fits, but on a
	   scrollable flex row with content wider than the container,
	   centering pushes half the overflow out of scroll range on EACH
	   side. Neither edge is ever reachable, no matter how far you swipe.
	   .cc-packages__grid never set justify-content so it didn't inherit
	   this; only dining venues needs the override back to flex-start. */
	body.is-court-caravan .cc-dining__venues {
		justify-content: flex-start;
	}

	body.is-court-caravan .cc-dining__venues::-webkit-scrollbar,
	body.is-court-caravan .cc-packages__grid::-webkit-scrollbar {
		display: none;
	}

	body.is-court-caravan .cc-dining__venue,
	body.is-court-caravan .cc-packages__card {
		flex: 0 0 74%;
		scroll-snap-align: start;
	}

	/* #97 The mast flag is sized for the desktop lockup. */
	body.is-court-caravan .cc-meetings__flag {
		width: 54px;
	}

	/* #98 Each rewards line holds together, and the art gets the room the
	   stacked column frees up. The breaks are <br>s in the copy, set for
	   the desktop lockup, so nowrap alone would not undo them.

	   #113 / #121: one line has to be one line that FITS. At a flat 1.5rem
	   "be rewarded forever" measures 357px against 297px of band at 393, and
	   223px at 319 — where it ran from x=-19 to x=338, off the screen
	   entirely. nowrap cannot wrap out of that, so the type has to scale.
	   357px at 24px is 14.875px of phrase per px of type, and the tightest
	   case (223px of band at 338) therefore needs ~15px = 4.4vw. Capped at
	   the original 1.5rem so nothing grows. */
	body.is-court-caravan .cc-rewards__stack {
		font-size: min(1.5rem, 4.4vw);
		white-space: nowrap;
	}

	body.is-court-caravan .cc-rewards__stack br {
		display: none;
	}

	body.is-court-caravan .cc-rewards__art {
		width: min(520px, 92%);
	}

	/* #99 The Instagram tiles were running nearly the full width. */
	body.is-court-caravan .vhc-igfeed__item img {
		max-width: 260px;
	}

	/* #104 The gallery's count moves below the photos and the heading
	   centres over them; the bar's two children reorder around the
	   slider, so it steps out of the way. */
	body.is-court-caravan .cc-gallery__inner {
		display: flex;
		flex-direction: column;
	}

	body.is-court-caravan .cc-gallery__bar {
		display: contents;
	}

	body.is-court-caravan .cc-gallery__bar > .cc-kicker {
		justify-content: center;
		margin-bottom: 1.5rem;
		order: 1;
		text-align: center;
	}

	body.is-court-caravan .cc-gallery__slider {
		order: 2;
	}

	body.is-court-caravan .cc-gallery__bar > .cc-pager {
		justify-content: center;
		margin-top: 1.25rem;
		order: 3;
	}

	/* #102 The subnav tabs wrap instead of running "Business Travel" off
	   the side. */
	body.is-brand-court .cc-subnav .wp-block-buttons {
		flex-wrap: wrap;
		justify-content: center;
		row-gap: 0.5rem;
	}
}

/* The rewards accordion signs off with valuedhotelguest@valenciagroup.com,
   one unbreakable 34-character token that is wider than a 320px screen and
   pushed the page sideways on its own. Long addresses in copy may break. */
body.is-brand-court .cc-accordion__footer {
	overflow-wrap: anywhere;
}

/* ═══════════════════════════════════════════════════════════════════════
   Overlay nav — the Court drop menu
   Figma 6345:11449 (desktop) / 6345:11484 (mobile). The parent's overlay
   is a full-screen pearl sheet: big display links ranged left beside a
   photo, with socials and a secondary row under them. The Court comp is a
   quieter thing — the property's script face centred in its blue over the
   ground, nothing beside it, and on desktop a panel that drops only as far
   as its content, leaving the hero in view beneath. Markup is the
   parent's; everything here is dress, so no template fork.
   ═══════════════════════════════════════════════════════════════════════ */

/* Nothing in the comp sits beside or beneath the links. */
body.is-brand-court .overlay-nav__media,
body.is-brand-court .overlay-nav__social,
body.is-brand-court .overlay-nav__secondary {
	display: none;
}

/* These boxes are content-box, so the parent's width:100% plus its own
   side padding measured wider than the screen and the open menu scrolled
   sideways on a phone. */
body.is-brand-court .overlay-nav__body,
body.is-brand-court .overlay-nav__menu,
body.is-brand-court .overlay-nav__manage {
	box-sizing: border-box;
}

body.is-brand-court .overlay-nav__body {
	gap: 0;
	grid-template-columns: minmax(0, 1fr);
	margin: 0 auto;
	max-width: none;
	padding: clamp(2.5rem, 6vw, 4.25rem) 1.5rem clamp(2.5rem, 5vw, 3.5rem);
}

/* The parent balances an auto top margin on the last child to centre the
   menu in a full-height sheet; a drop panel has nothing to centre. */
body.is-brand-court .overlay-nav > :last-child {
	margin-bottom: 0;
}

body.is-brand-court .overlay-nav__menu {
	align-items: center;
	display: flex;
	flex-direction: column;
}

/* The links: the property's script face, in its blue. This is the ticket
   — they were inheriting the collection's display face at the hotel size
   (BugHerd #18 / #87). */
body.is-brand-court .overlay-nav__primary {
	text-align: center;
}

body.is-brand-court .overlay-nav__primary a {
	color: var(--wp--preset--color--court-blue);
	font-family: var(--wp--preset--font-family--script);
	font-size: 1.75rem;
	font-weight: 400;
	line-height: 1.3;
}

body.is-brand-court .overlay-nav__primary a:hover,
body.is-brand-court .overlay-nav__primary a:focus-visible {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

/* Manage reservations: the Court keyline button. */
body.is-brand-court .overlay-nav__manage {
	border-color: var(--wp--preset--color--court-blue);
	color: var(--wp--preset--color--court-blue);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	margin-top: clamp(2rem, 4vw, 3.25rem);
	padding: 0.875rem 1.5rem;
	transition: background-color 0.25s ease, color 0.25s ease;
}

body.is-brand-court .overlay-nav__manage:hover {
	background: var(--wp--preset--color--court-blue);
	color: var(--wp--preset--color--pearl);
}

/* The bar reads as three cells divided by rules, the flag centred. The
   parent sizes it from --valencia-header-bar-height, which is shorter
   than the Court header, so the flag dropped a couple of dozen pixels the
   moment the menu opened; matching the header keeps it still — and lands
   on the comp's 73px without hardcoding it. */
/* The overlay bar REPLACES the header in place, so any difference between the
   two reads as the chrome jumping the moment the menu opens. Measured at 1440
   before this: BOOK 159 -> 223 wide, the brand's centre moved 12px, and the X
   sat 7px left of the hamburger and ran flush to the window edge where the
   header stops short of it. Same labels — the boxes were simply built twice,
   to different rules. Each cell below now uses the header's own sizing. */
body.is-brand-court .overlay-nav__bar {
	height: var(--valencia-header-height, var(--valencia-header-bar-height));
}

body.is-brand-court .overlay-nav__reserve {
	align-items: center;
	background: none;
	border-right: 1px solid var(--section-hairline);
	color: var(--wp--preset--color--midnight);
	display: inline-flex;
	font-family: var(--wp--preset--font-family--body);
	justify-content: center;
	letter-spacing: 0.1em;
	/* The header's BOOK cell, exactly: a fixed width and no padding. The
	   32px it used to carry either side is what made it 64px wider. */
	min-width: 0;
	padding: 0;
	width: clamp(96px, 11vw, 158px);
}

body.is-brand-court .overlay-nav__reserve:hover {
	background: none;
	color: var(--wp--preset--color--court-blue);
}

body.is-brand-court .overlay-nav__close {
	align-self: stretch;
	border-left: 1px solid var(--section-hairline);
	/* The header's toggle carries the parent's -0.6875rem hit-area bleed, so
	   it sits 11px into the bar's right padding. Zeroing the margin here left
	   the X 11px short of where the hamburger was. Only the horizontal half
	   is mirrored — this one stretches, so it has no vertical bleed. */
	margin: 0 -0.6875rem 0 0;
	/* The header's toggle, exactly: sized by its padding, not a flat width,
	   so the rule down its left edge lands where the hamburger's did. */
	min-width: 0;
	padding: 0 clamp(1.5rem, 4vw, 3.75rem);
	width: auto;
}

/* Desktop: a drop panel, not a sheet — it ends with its content and the
   hero carries on below. */
@media (min-width: 982px) {
	body.is-brand-court .overlay-nav {
		bottom: auto;
		height: auto;
		max-height: 100dvh;
	}
}

@media (max-width: 640px) {
	/* Mobile takes the whole screen, links a size up, and the button runs
	   the content width. */
	body.is-brand-court .overlay-nav__body {
		padding-bottom: 3rem;
		padding-top: 3rem;
	}

	body.is-brand-court .overlay-nav__primary a {
		font-size: 2rem;
		letter-spacing: 0.02em;
		line-height: 1.5;
	}

	body.is-brand-court .overlay-nav__manage {
		display: block;
		text-align: center;
		width: 100%;
	}

	body.is-brand-court .overlay-nav__menu {
		width: 100%;
	}

	body.is-brand-court .overlay-nav__reserve {
		min-width: 78px;
	}

	body.is-brand-court .overlay-nav__close {
		min-width: 62px;
	}
}

/* ═══════════════════════════════════════════════════════════════════════
   Court footer on a phone — Figma 6345:10786 (BugHerd #100)
   The 981px rule drops the three desktop columns into one centred stack;
   the comp keeps the two menus side by side under the lockup and then
   runs everything else down the middle. The pieces live inside the three
   columns, so those go display:contents and their children place
   themselves on a two-column grid — the selectors still read the DOM, so
   left and right menus stay tellable apart.
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 640px) {
	body.is-brand-court .court-footer__main {
		column-gap: 1.375rem;
		display: grid;
		grid-template-columns: 1fr 1fr;
		justify-items: stretch;
		padding: 0 1.25rem;
		text-align: left;
	}

	body.is-brand-court .court-footer__col,
	body.is-brand-court .court-footer__center {
		display: contents;
	}

	body.is-brand-court .court-footer__logo {
		grid-area: 1 / 1 / 2 / 3;
		margin: 0 auto 3.5rem;
		width: min(200px, 60%);
	}

	/* Ranged left inside their own column — the footer centres its text
	   everywhere else, which left the two menus floating mid-column. */
	body.is-brand-court .court-footer__col--left > .court-footer__nav {
		grid-area: 2 / 1 / 3 / 2;
		text-align: left;
	}

	body.is-brand-court .court-footer__col--right > .court-footer__nav {
		grid-area: 2 / 2 / 3 / 3;
		text-align: left;
	}

	/* Loose leading here, unlike the desktop column (#36), and the long
	   labels have to wrap in a half-width column rather than hold one
	   line the way they do across the page (#41). */
	body.is-brand-court .court-footer__nav li {
		line-height: 1.9;
		margin: 0;
		white-space: normal;
	}

	body.is-brand-court .court-footer__social {
		grid-area: 3 / 1 / 4 / 3;
		margin-top: 3rem;
	}

	body.is-brand-court .court-footer__manage {
		grid-area: 4 / 1 / 5 / 3;
		justify-self: center;
		margin-top: 1.5rem;
	}

	body.is-brand-court .court-footer__phone {
		grid-area: 5 / 1 / 6 / 3;
		margin-top: 1.125rem;
		text-align: center;
	}

	/* The newsletter keeps its own left edge; the legal block centres and
	   leads with the colophon, which follows the links in the markup. */
	body.is-brand-court .court-footer__meta {
		align-items: stretch;
		padding-left: 1.75rem;
		padding-right: 1.75rem;
	}

	body.is-brand-court .court-footer__legal {
		align-items: center;
		gap: 1.25rem;
	}

	body.is-brand-court .court-footer__colophon {
		order: -1;
		text-align: center;
	}

	body.is-brand-court .court-footer__legal-nav ul {
		align-items: center;
		flex-direction: column;
		gap: 0;
	}

	body.is-brand-court .court-footer__collection {
		flex-direction: column;
		gap: 0.875rem;
		justify-content: center;
		text-align: center;
	}
}

/* A venue name that runs to two lines is an inline-block, so its baseline
   is the last line's and the list marker sat beside the wrong one. Block
   puts the number on the first line of type (BugHerd #106). */
body.is-brand-court .vhc-exmap__venues li > button {
	display: block;
}

/* ─── Reserve: the property's blue ──────────────────────────────────────
   The panel and the BOOK tab's hover both came through from the parent in
   golden hour (BugHerd #17); the hover text goes pearl, because the
   parent's midnight on the property's blue is barely a contrast at all.

   One selector is enough: the panel's inner blocks now inherit its
   background rather than painting their own, so nothing strands a gold bar
   inside a blue panel. This used to also name .reserve-panel__foot, which
   the parent then stopped painting — leaving the new
   .reserve-panel__sticky wrapper around Reserve Now gold while the foot
   inside it went blue. The parent no longer paints either. */
body.is-brand-court .reserve-panel {
	background: var(--wp--preset--color--court-blue);
}

/* Texican's field text goes up a step. Piscolabis isn't short — its
   x-height at 13px (6.5px) beats Compagnon's and all but matches
   Helvetica's — it's CONDENSED: "Add Dates" sets 37px wide where
   Helvetica takes 61px. So it reads small horizontally, and the fix is
   size rather than the line-height or tracking you'd reach for with a
   genuinely small-on-the-body face.

   Every value in the panel moves together — the closed control, the open
   dropdown's options, the promo input and the guest popover's rows — or
   picking an option would visibly resize the text you just read. The
   uppercase Compagnon labels stay put; they're the caption style, and the
   contrast with the values is the design. The steppers' plus and minus
   stay too: fixed 22px circles, glyphs not text.

   Room to spare at 16px: the control's inner width is 316px and the
   longest value it ever holds, a full date range, sets 117px. */
body.is-court-texican .reserve-field__control,
body.is-court-texican .reserve-field__input,
body.is-court-texican .reserve-dropdown button,
body.is-court-texican .reserve-guests__who,
body.is-court-texican .reserve-stepper__count {
	font-size: 1rem;
}

body.is-brand-court .site-header__reserve:hover,
body.is-brand-court .site-header.is-past-hero .site-header__reserve:hover,
body.is-brand-court:not(.has-immersive-hero) .site-header__reserve:hover {
	background: var(--wp--preset--color--court-blue);
	color: var(--wp--preset--color--pearl);
}

/* ─── Eat & drink: the palms above the eyebrow ──────────────────────────
   Figma 6345:9514, the property's two-palms-with-sun mark (BugHerd #24).
   Masked so it takes the band colour, like the kicker star and the pager
   arrow. The eyebrow drops its star here for the same reason the Meetings
   mast did (#30): the mark above it is already the section's ornament, and
   two stacked read as a mistake — Meg's mockup shows it without.
   Caravan-only, since the artwork is its own; another Court opts in by
   adding palms.svg to its brand folder and extending this rule. */
body.is-court-caravan .cc-dining::before {
	background: var(--wp--preset--color--court-band);
	content: '';
	display: block;
	height: 94px;
	margin: 0 auto clamp(1.25rem, 3vw, 2rem);
	-webkit-mask: url('assets/images/brands/caravan/palms.svg') no-repeat center / contain;
	mask: url('assets/images/brands/caravan/palms.svg') no-repeat center / contain;
	width: 98px;
}

body.is-court-caravan .cc-dining__kicker::before {
	display: none;
}

/* ─── Review band: the maroon card on the client's pattern ──────────────
   Figma 6345:11601/11602 (BugHerd #32). The mark and the stars needed
   nothing — the mark is pixel-identical to the comp, and in this theme
   golden-hour already resolves to the property's own accent, which is the
   comp's gold. Only the card's colour is new here; the pattern, its tile
   and its position are block attributes, since the band carries them as
   an inline style that no stylesheet rule would beat. */
.cc-review--maroon .cc-review__card {
	background: var(--wp--preset--color--court-maroon);
}

/* ─── Instagram strip: the pager in the property's blue ─────────────────
   BugHerd #35. The strip itself sits on the page ground; what carried the
   collection's gold was the progress bar under it — track in the accent
   tint, fill in the accent. Both take the blue and its light tint. */
body.is-brand-court .vhc-igfeed .vhc-slider__progress {
	background: var(--wp--preset--color--court-blue-light);
}

body.is-brand-court .vhc-igfeed .vhc-slider__progress span {
	background: var(--wp--preset--color--court-blue);
}

/* ─── Brand illustrations under a headline ──────────────────────────────
   BugHerd #108/#109 (list bands) and #110 (the centred intro). Meg's pins
   sit below the type and right of its centre, so the drawing hangs off the
   end of the headline rather than lining up under its first letter. */
.cc-list__illo {
	margin: clamp(1.5rem, 3vw, 2.5rem) 0 0 auto;
	max-width: 220px;
	width: 60%;
}

.cc-list__illo img {
	display: block;
	height: auto;
	width: 100%;
}

/* The medallion is centred, so this one is nudged off that centre rather
   than pushed to an edge. */
.cc-intro--center .cc-intro__illo {
	margin: clamp(1.75rem, 3.5vw, 3rem) 0 0 auto;
	max-width: 240px;
	transform: translateX(-12%);
	width: 40%;
}

.cc-intro__illo img {
	display: block;
	height: auto;
	width: 100%;
}

@media (max-width: 640px) {
	/* Centred on a phone — there is no room to sit it off to one side. */
	.cc-list__illo,
	.cc-intro--center .cc-intro__illo {
		margin-left: auto;
		margin-right: auto;
		transform: none;
		width: min(180px, 52%);
	}
}

/* The split intro carries its drawing in the copy column, hung off the end
   of the paragraph the same way (Texican #40, Lone Star #24). Since #29
   centred that column it takes the medallion's nudge-off-centre instead of
   hanging off a wide right-hand column. */
.cc-intro--split .cc-intro__illo {
	margin: clamp(1.75rem, 3.5vw, 3rem) 0 0 auto;
	max-width: 240px;
	transform: translateX(-12%);
	width: 40%;
}

/* Feature bands take one beside the mast headline (Texican #38) and one
   under an individual feature's copy (Cotton #13, Cavalry #20). */
/* The mast is centred type, but the pin sits right of its centre — the
   drawing hangs off the end of the headline, as on every other band. */
.cc-feature__illo {
	margin: clamp(1.25rem, 2.5vw, 2rem) 0 0 auto;
	max-width: 190px;
	width: 26%;
}

.cc-feature__body-illo {
	margin: clamp(1.5rem, 3vw, 2.5rem) 0 0 auto;
	max-width: 210px;
	width: 55%;
}

.cc-feature__illo img,
.cc-feature__body-illo img,
.cc-photoset__illo img {
	display: block;
	height: auto;
	width: 100%;
}

/* The pair aligns its photos to the bottom, so the corner above the shorter
   one is empty cream; the drawing is centred on the designer's pin inside
   it (Cotton #15, Texican #42, Cavalry #23). */
.cc-photoset--pair .cc-photoset__grid { position: relative; }

.cc-photoset__illo {
	left: var(--vhc-court-photoset-illo-left, 32%);
	margin: 0;
	position: absolute;
	top: var(--vhc-court-photoset-illo-top, 39%);
	transform: translate(-50%, -50%);
	width: var(--vhc-court-photoset-illo-width, 14%);
}

@media (max-width: 640px) {
	.cc-intro--split .cc-intro__illo,
	.cc-feature__illo,
	.cc-feature__body-illo {
		margin-left: auto;
		margin-right: auto;
		transform: none;
		width: min(180px, 52%);
	}

	/* No empty corner to sit in once the pair stacks — it becomes a plain
	   accent between the two photos. */
	.cc-photoset__illo {
		left: auto;
		margin: 0 auto;
		position: static;
		top: auto;
		transform: none;
		width: min(150px, 42%);
	}
}


/* ─── Texican mobile review: #47, #48, #49 ────────────────────────────── */
@media (max-width: 640px) {
	/* #49 — the brand mark sat 12px left of centre on all five Courts. The
	   header row is already a symmetric three-column grid, but the parent
	   theme pads it 1.5rem on the right and nothing on the left, so the
	   whole grid walks over by half that. Pad both sides and give the
	   reserve button a negative margin so it keeps its bleed to the edge.
	   Scoped to the Courts and to mobile: the padding itself lives in the
	   parent theme, where changing it would move every site's header. */
	body.is-brand-court .site-header__inner {
		padding-left: 1.5rem;
	}

	body.is-brand-court .site-header__reserve {
		margin-left: -1.5rem;
	}

	/* #47 — the footer mark sat hard against the top edge of the band.
	   Caravan #114: 2.5rem was still tight for a 156px mark, and it read as
	   lopsided against the 3.5rem beneath it. Matched to that, so the mark
	   sits evenly in its own space. */
	body.is-brand-court .court-footer__logo {
		margin-top: 3.5rem;
	}

	/* #48 — the braid is a repeating ornament 1324px wide by 29 tall, so
	   at 345px it drew 7.5px high and the weave was invisible. Give it a
	   height and let it crop rather than shrink: fewer repeats, legible
	   detail, and no horizontal overflow. */
	body.is-brand-court .court-footer__divider {
		height: 18px;
		object-fit: cover;
		object-position: center;
	}
}


/* ─── Texican mobile review, second batch: #43 ────────────────────────── */
@media (max-width: 640px) {
	/* The two hero tags are both absolutely placed on the same baseline,
	   one from the left edge and one from the right. At 393px they are
	   203px and 173px wide in a 393px window, so they run into each other
	   across about 31px — "An ode to all things Tex-Mex" sitting on top of
	   "Las Colinas, Irving, Texas". Give each the full width and lift the
	   left one clear so they stack instead of collide. */
	body.is-brand-court .cc-hero__tag {
		font-size: 1.125rem;
		left: 1.5rem;
		right: 1.5rem;
	}

	/* Caravan #111: the lift used to be `bottom: calc(9% + 3.25em)`, and on
	   iOS Safari it did nothing — the two tags printed on top of each other
	   on one baseline. The percentage resolves against the hero, whose
	   height comes from `min-height: 100vh`, i.e. an indefinite containing
	   block; Chrome resolves the calc anyway, Safari drops it. A transform
	   needs no containing-block height, so it lifts the same 3.25em
	   everywhere. Same geometry in Chrome — measured, a 35px gap at 393. */
	body.is-brand-court .cc-hero__tag--left {
		bottom: 9%;
		transform: translateY(-3.25em);
	}
}


/* Caravan #123 — "different photo crop? says 'van cour' on mobile".

   The Explore hero is a landscape photograph of the building's sign,
   2000x1117, in a frame that is 100vh tall. At a phone's proportions
   `cover` scales the image to the frame's HEIGHT, so only the middle
   quarter of its width survives: 393/1525, or 25.8%. The sign reads
   "CARAVAN COURT HOTEL" across 57% of the frame, so the quarter that
   showed was "VAN COUR".

   No object-position fixes that by framing one whole word. The words sit
   too close together: the gap after "CARAVAN" is at 906px and "HOTEL"
   starts at 1300px, a clean span of 394px, and the window is 516px wide.
   Every position that contains all of "COURT" also catches "AN" or "HOT".

   So the crop moves off the sign entirely, to the left of the frame — the
   zigzag roofline against sky, a window, the cream wall and the wood band.
   No lettering, and it is the same mid-century geometry the brand is built
   on, so it reads as a chosen detail rather than a broken one. The sign
   begins at 564px and the window ends at 516px, 48px clear.

   Matched on the file rather than the page, so replacing the photograph
   retires the rule with it — a new picture should get its own decision
   rather than silently inherit this one.

   Caveat, measured rather than assumed: the visible fraction is
   0.5585 x (width / height), so it is 25.8% on every recent iPhone and
   Android (they all sit near a 0.46 ratio). On a 375x667 iPhone SE it is
   31.4%, a 628px window, which catches about 64px of the "C". Still far
   better than a half-word, but it is not zero on that one device. */
@media (max-width: 781px) {
	.cc-phero img[src*="cc-explore-hero"] {
		object-position: 0% center;
	}
}