/*
 * VRT Cash Rent: county pages and the Texas hub.
 * Tokens captured from veritaslandco.com. Fonts are enqueued site-wide by the
 * theme and referenced by name only.
 */

.vrt-cr-page,
.vrt-cr {
	--vrt-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--vrt-font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--vrt-text: #222222;
	--vrt-muted: #666666;
	--vrt-bg: #f8f8f8;
	--vrt-surface: #ffffff;
	--vrt-gold: #ffcc00;
	--vrt-on-gold: #1a1a1a;
	--vrt-rule: #e9e9e9;
	--vrt-band: #f3f3f3;
	--vrt-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
	--vrt-radius: 8px;

	/* Charts: gold county line, neutral gray Texas line. */
	--vrt-cr-county: #ffcc00;
	--vrt-cr-texas: #8a8a8a;
	--vrt-cr-grid: #ececec;
	--vrt-cr-baseline: #d6d6d6;
	--vrt-cr-band: #f3f3f3;
	--vrt-cr-muted: #666666;
	--vrt-cr-surface: #ffffff;
}

/* ---- Backstop: theme post-header parts never show on our pages ------------------------
 * Our template replaces the theme's single/page template, so these should not be in
 * the markup at all. If a theme prints them from header.php instead, hide them here.
 */
body.vrt-cashrent-page .breadcrumb-wrap,
body.vrt-cashrent-page .author-meta,
body.vrt-cashrent-page .page-title-wrap,
body.vrt-cashrent-page .post-meta-wrap {
	display: none !important;
}

/* ---- Page shell (our clean template) ------------------------------------------------ */

.vrt-cr-page {
	background: var(--vrt-bg);
	color: var(--vrt-text);
	font-family: var(--vrt-font-body);
	font-size: 16px;
	line-height: 1.6;
}

.vrt-cr-container {
	max-width: 1140px;
	margin: 0 auto;
	padding: 32px 16px 80px;
	box-sizing: border-box;
}

.vrt-cr {
	color: var(--vrt-text);
	font-family: var(--vrt-font-body);
}

.vrt-cr *,
.vrt-cr *::before,
.vrt-cr *::after {
	box-sizing: border-box;
}

.vrt-cr a {
	color: var(--vrt-text);
	text-decoration-color: var(--vrt-gold);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.vrt-cr a:hover,
.vrt-cr a:focus {
	color: var(--vrt-on-gold);
	text-decoration-color: var(--vrt-on-gold);
}

.vrt-cr-title,
.vrt-cr h2 {
	font-family: var(--vrt-font-display);
	font-weight: 700;
	color: var(--vrt-text);
	letter-spacing: 0;
}

/* Cormorant defaults to old-style digits; data figures read better lining. */
.vrt-cr-title,
.vrt-cr h2,
.vrt-cr-hero-value,
.vrt-cr-card-value,
.vrt-cr-hub-table td:nth-child(3),
.vrt-cr .vpl-price {
	font-variant-numeric: lining-nums;
	font-feature-settings: "lnum" 1;
}

.vrt-cr-title {
	margin: 0 0 24px;
	font-size: clamp(2.25rem, 5vw, 3.25rem);
	line-height: 1.1;
}

.vrt-cr h2 {
	margin: 0 0 20px;
	font-size: clamp(1.75rem, 3.2vw, 2.25rem);
	line-height: 1.15;
}

.vrt-cr h3 {
	margin: 0 0 8px;
	font-family: var(--vrt-font-body);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--vrt-text);
}

.vrt-cr p {
	margin: 0 0 12px;
}

.vrt-cr-section {
	margin: 64px 0 0;
}

.vrt-cr-section > p {
	max-width: 760px;
}

.vrt-cr-unit {
	font-family: var(--vrt-font-body);
	font-size: 1rem;
	font-weight: 400;
	color: var(--vrt-muted);
}

/* ---- Breadcrumb ---------------------------------------------------------------------- */

.vrt-cr-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: var(--vrt-muted);
}

.vrt-cr-breadcrumb li + li::before {
	content: "/";
	margin-right: 6px;
	color: #b5b5b5;
}

.vrt-cr-breadcrumb a {
	color: var(--vrt-muted);
	text-decoration: none;
}

.vrt-cr-breadcrumb a:hover,
.vrt-cr-breadcrumb a:focus {
	color: var(--vrt-text);
	text-decoration: underline;
	text-decoration-color: var(--vrt-gold);
}

.vrt-cr-breadcrumb a[aria-current="page"] {
	color: var(--vrt-text);
}

/* ---- Surfaces: white, 8px radius, subtle shadow ------------------------------------------- */

.vrt-cr-hero,
.vrt-cr-card,
.vrt-cr-chart,
.vrt-cr-table-wrap,
.vrt-cr-compare-item,
.vrt-cr-ranks,
.vrt-cr-faq-list,
.vrt-cr-cta,
.vrt-cr-methodology {
	background: var(--vrt-surface);
	border-radius: var(--vrt-radius);
	box-shadow: var(--vrt-shadow);
}

/* ---- 1. Headline ---------------------------------------------------------------------------- */

.vrt-cr-hero {
	padding: 32px 36px;
	border-left: 4px solid var(--vrt-gold);
}

.vrt-cr-hero-label {
	margin: 0 0 4px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: var(--vrt-muted);
}

.vrt-cr-hero-value {
	margin: 0;
	font-family: var(--vrt-font-display);
	font-size: clamp(3.5rem, 9vw, 5.5rem);
	font-weight: 700;
	line-height: 1;
	color: var(--vrt-text);
}

.vrt-cr-hero-value .vrt-cr-unit {
	margin-left: 6px;
	font-size: 1.125rem;
}

.vrt-cr-hero-change {
	margin: 12px 0 0;
	font-size: 1.0625rem;
	font-weight: 500;
}

.vrt-cr-hero-note,
.vrt-cr-hero-none {
	margin: 16px 0 0;
	max-width: 680px;
	color: var(--vrt-muted);
}

/* ---- 2. Land-type cards ---------------------------------------------------------------------- */

.vrt-cr-cards,
.vrt-cr-compare,
.vrt-cr-charts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 24px;
}

.vrt-cr-card {
	padding: 24px 28px;
}

.vrt-cr-card h3,
.vrt-cr-compare-item h3,
.vrt-cr-chart figcaption {
	margin: 0 0 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vrt-muted);
}

.vrt-cr-card-value {
	margin: 0 0 8px;
	font-family: var(--vrt-font-display);
	font-size: 2.75rem;
	font-weight: 700;
	line-height: 1;
}

.vrt-cr-card-value .vrt-cr-unit {
	margin-left: 4px;
	font-size: 0.9375rem;
}

.vrt-cr-card-value.is-missing {
	font-family: var(--vrt-font-body);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--vrt-muted);
}

.vrt-cr-card-change {
	margin: 0 0 6px;
	font-size: 15px;
}

.vrt-cr-card-cv {
	margin: 12px 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--vrt-rule);
	font-size: 13px;
	color: var(--vrt-muted);
}

.vrt-cr-card-cv abbr {
	text-decoration: underline dotted;
	cursor: help;
}

/* ---- Calls to action (buttons match the theme .btn) --------------------------------------------- */

.vrt-cr-button {
	display: inline-block;
	padding: 14px 28px;
	border: 1px solid var(--vrt-gold);
	border-radius: 4px;
	background: var(--vrt-gold);
	color: var(--vrt-on-gold);
	font-family: var(--vrt-font-body);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.vrt-cr a.vrt-cr-button,
.vrt-cr a.vrt-cr-button:hover,
.vrt-cr a.vrt-cr-button:focus {
	color: var(--vrt-on-gold);
	text-decoration: none;
}

.vrt-cr a.vrt-cr-button:hover,
.vrt-cr a.vrt-cr-button:focus {
	background: #f2c200;
	border-color: #f2c200;
}

.vrt-cr a.vrt-cr-button:focus-visible {
	outline: 2px solid var(--vrt-on-gold);
	outline-offset: 2px;
}

.vrt-cr-cta {
	margin: 40px 0 0;
	padding: 36px 40px;
}

.vrt-cr-cta h2 {
	margin-bottom: 8px;
}

.vrt-cr-cta p {
	max-width: 640px;
}

.vrt-cr-cta p:last-child {
	margin: 20px 0 0;
}

.vrt-cr-cta-lease {
	border-top: 4px solid var(--vrt-gold);
}

.vrt-cr-cta-sell {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 32px;
	padding: 28px 40px;
}

.vrt-cr-cta-sell p,
.vrt-cr-cta-sell p:last-child {
	margin: 0;
}

.vrt-cr-cta-sell p:first-child {
	font-size: 1.125rem;
	font-weight: 500;
}

/* ---- 3. History -------------------------------------------------------------------------------------- */

.vrt-cr-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	font-size: 14px;
	color: var(--vrt-muted);
}

.vrt-cr-key {
	display: inline-block;
	width: 20px;
	height: 3px;
	margin-right: 8px;
	vertical-align: middle;
	border-radius: 2px;
}

.vrt-cr-key.is-county {
	background: var(--vrt-cr-county);
}

.vrt-cr-key.is-texas {
	height: 2px;
	background: var(--vrt-cr-texas);
}

.vrt-cr-key.is-gap {
	width: 14px;
	height: 14px;
	background: var(--vrt-cr-band);
	border: 1px solid var(--vrt-rule);
}

.vrt-cr-chart {
	margin: 0;
	padding: 20px 20px 12px;
}

.vrt-cr-svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.vrt-cr-band {
	fill: var(--vrt-cr-band);
}

.vrt-cr-grid {
	stroke: var(--vrt-cr-grid);
	stroke-width: 1;
}

.vrt-cr-baseline {
	stroke: var(--vrt-cr-baseline);
	stroke-width: 1;
}

.vrt-cr-axis {
	fill: var(--vrt-cr-muted);
	font-family: var(--vrt-font-body);
	font-size: 10px;
	font-variant-numeric: tabular-nums;
}

.vrt-cr-line {
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.vrt-cr-line.is-county {
	stroke: var(--vrt-cr-county);
	stroke-width: 3;
}

.vrt-cr-line.is-texas {
	stroke: var(--vrt-cr-texas);
	stroke-width: 2;
}

.vrt-cr-dot {
	fill: var(--vrt-cr-county);
	stroke: var(--vrt-cr-surface);
	stroke-width: 2;
}

.vrt-cr-endlabel {
	fill: var(--vrt-text);
	font-family: var(--vrt-font-body);
	font-size: 11px;
	font-weight: 600;
}

.vrt-cr-chart-empty {
	margin: 0;
	color: var(--vrt-muted);
}

.vrt-cr-table-wrap {
	margin-top: 24px;
	padding: 8px 24px 12px;
	overflow-x: auto;
}

.vrt-cr-table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	font-size: 15px;
	font-variant-numeric: tabular-nums;
}

.vrt-cr-table caption {
	padding: 16px 0 8px;
	text-align: left;
	font-size: 13px;
	font-weight: 500;
	color: var(--vrt-muted);
}

.vrt-cr-table th,
.vrt-cr-table td {
	padding: 14px 12px;
	border: 0;
	border-bottom: 1px solid var(--vrt-rule);
	text-align: right;
	vertical-align: middle;
}

.vrt-cr-table tbody tr:last-child > * {
	border-bottom: 0;
}

.vrt-cr-table thead th {
	padding-top: 8px;
	padding-bottom: 10px;
	border-bottom: 1px solid #dcdcdc;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--vrt-muted);
	white-space: nowrap;
}

.vrt-cr-table th:first-child,
.vrt-cr-table td:first-child {
	padding-left: 0;
	text-align: left;
}

.vrt-cr-table th:last-child,
.vrt-cr-table td:last-child {
	padding-right: 0;
}

.vrt-cr-table tbody th {
	font-weight: 600;
}

.vrt-cr-table td.is-suppressed {
	color: #9a9a9a;
}

.vrt-cr-table tr.is-no-release td,
.vrt-cr-table td.is-no-release {
	background: var(--vrt-band);
	color: var(--vrt-muted);
	font-size: 14px;
	font-style: italic;
	text-align: left;
}

.vrt-cr-table tr.is-no-release td {
	padding-left: 12px;
}

.vrt-cr-table-note {
	margin: 12px 0 0;
	font-size: 13px;
	color: var(--vrt-muted);
}

.vrt-cr-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---- 4-6. Comparison, neighbors, district rank -------------------------------------------------- */

.vrt-cr-compare-item {
	padding: 24px 28px;
}

.vrt-cr-compare-item ul,
.vrt-cr-ranks {
	margin: 0;
	padding: 0;
	list-style: none;
}

.vrt-cr-compare-item li {
	padding: 10px 0;
	border-top: 1px solid var(--vrt-rule);
	line-height: 1.55;
}

.vrt-cr-compare-item li:first-child {
	padding-top: 0;
	border-top: 0;
}

.vrt-cr-neighbors td.is-no-figure {
	color: #9a9a9a;
	font-style: italic;
}

.vrt-cr-ranks {
	padding: 8px 28px;
}

.vrt-cr-ranks li {
	padding: 14px 0;
	border-top: 1px solid var(--vrt-rule);
	font-size: 1.0625rem;
}

.vrt-cr-ranks li:first-child {
	border-top: 0;
}

/* ---- 7. Listings: the site's property-card markup, styled here so it renders without the site's card CSS ---- */

.vrt-cr-listing-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.vrt-cr .vpl-card {
	display: flex;
	flex-direction: column;
	position: relative;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: #ffffff;
	border-radius: 8px;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
}

.vrt-cr .vpl-card-image-wrap {
	display: block;
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #eeeeee;
}

.vrt-cr .vpl-card-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.vrt-cr .vpl-card:hover .vpl-card-image {
	transform: scale(1.03);
}

.vrt-cr .vpl-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	padding: 6px 10px;
	border-radius: 4px;
	background: #ffcc00;
	color: #1a1a1a;
	font-family: var(--vrt-font-body);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
	text-transform: uppercase;
}

.vrt-cr .vpl-card-body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 8px;
	position: relative;
	padding: 20px;
}

.vrt-cr .vpl-location {
	margin: 0;
	font-family: var(--vrt-font-body);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
	color: #666666;
}

.vrt-cr .vpl-title {
	margin: 0;
	font-family: var(--vrt-font-body);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
}

.vrt-cr .vpl-title a {
	color: #1a1a1a;
	text-decoration: none;
}

.vrt-cr .vpl-title a:hover,
.vrt-cr .vpl-title a:focus {
	text-decoration: underline;
	text-decoration-color: #ffcc00;
}

.vrt-cr .vpl-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 14px;
	margin-top: auto;
	padding-right: 44px;
}

.vrt-cr .vpl-price {
	font-family: var(--vrt-font-display);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.1;
	color: #ffcc00;
}

.vrt-cr .vpl-price.is-empty {
	font-family: var(--vrt-font-body);
	font-size: 14px;
	font-weight: 500;
	color: #666666;
}

.vrt-cr .vpl-acres {
	font-family: var(--vrt-font-body);
	font-size: 15px;
	color: #222222;
}

.vrt-cr .vpl-ppa {
	font-family: var(--vrt-font-body);
	font-size: 13px;
	color: #666666;
}

.vrt-cr .vpl-card-cta {
	position: absolute;
	right: 20px;
	bottom: 18px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #ffcc00;
	text-decoration: none;
}

.vrt-cr .vpl-card-cta::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 8px;
	height: 8px;
	border-top: 2px solid #1a1a1a;
	border-right: 2px solid #1a1a1a;
	transform: translate(-65%, -50%) rotate(45deg);
}

.vrt-cr .vpl-card-cta:focus-visible {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

.vrt-cr-listing-count {
	margin: 20px 0 0;
	font-size: 14px;
	color: var(--vrt-muted);
}

/* ---- FAQ, hub link, methodology --------------------------------------------------------------------- */

.vrt-cr-faq-item {
	padding: 22px 28px;
	border-top: 1px solid var(--vrt-rule);
}

.vrt-cr-faq-item:first-child {
	border-top: 0;
}

.vrt-cr-faq-item h3 {
	margin: 0 0 6px;
	font-size: 1.0625rem;
}

.vrt-cr-faq-item p {
	margin: 0;
	max-width: 760px;
}

.vrt-cr-hub-link {
	margin: 40px 0 0;
	font-size: 1.0625rem;
	font-weight: 600;
}

.vrt-cr-methodology {
	padding: 32px 40px;
	font-size: 14px;
	line-height: 1.65;
	color: var(--vrt-muted);
}

.vrt-cr-methodology h2 {
	font-size: 1.5rem;
}

.vrt-cr-methodology p {
	max-width: 820px;
}

.vrt-cr-notes {
	margin: 48px 0 0;
	max-width: 760px;
}

.vrt-cr-empty {
	color: var(--vrt-muted);
}

/* ---- Hub ------------------------------------------------------------------------------------------------ */

.vrt-cr-hub-intro {
	max-width: 760px;
	font-size: 1.0625rem;
	color: var(--vrt-muted);
}

.vrt-cr-hub .vrt-cr-section {
	margin-top: 48px;
}

.vrt-cr-hub-table td:nth-child(2) {
	text-align: left;
	color: var(--vrt-muted);
}

.vrt-cr-hub-table td:nth-child(3) {
	font-family: var(--vrt-font-display);
	font-size: 1.375rem;
	font-weight: 700;
	white-space: nowrap;
}

.vrt-cr-hub-table tbody th a {
	text-decoration: none;
}

.vrt-cr-hub-table tbody th a:hover,
.vrt-cr-hub-table tbody th a:focus {
	text-decoration: underline;
	text-decoration-color: var(--vrt-gold);
}

/* ---- Small screens ---------------------------------------------------------------------------------------- */

@media (max-width: 960px) {
	.vrt-cr-listing-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.vrt-cr-container {
		padding: 20px 16px 56px;
	}

	.vrt-cr-section {
		margin-top: 48px;
	}

	.vrt-cr-hero,
	.vrt-cr-cta,
	.vrt-cr-methodology {
		padding: 24px 20px;
	}

	.vrt-cr-card,
	.vrt-cr-compare-item,
	.vrt-cr-faq-item,
	.vrt-cr-ranks {
		padding-left: 20px;
		padding-right: 20px;
	}

	.vrt-cr-table-wrap {
		padding: 4px 16px 8px;
	}

	.vrt-cr-table th,
	.vrt-cr-table td {
		padding: 12px 8px;
		font-size: 14px;
	}

	.vrt-cr-table thead th {
		white-space: normal;
		font-size: 11px;
		letter-spacing: 0.04em;
		vertical-align: bottom;
	}

	.vrt-cr-listing-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}
