/*
Theme Name: JAX House Offer
Description: Minimal accessible Gutenberg block theme foundation for JAXHouseOffer.
Version: 0.1.15
Requires at least: 6.7
Requires PHP: 8.1
Text Domain: jax-house-offer
*/

/* Keyboard access is visible without changing normal pointer styling. */
.skip-link {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	left: 1rem;
	padding: 0.75rem 1rem;
	position: fixed;
	top: 1rem;
	transform: translateY(-200%);
	z-index: 100000;
}

.skip-link:focus {
	transform: translateY(0);
}

:where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
	outline: 3px solid var(--wp--preset--color--focus);
	outline-offset: 3px;
}

:where(a) {
	text-decoration-thickness: 0.125em;
	text-underline-offset: 0.16em;
}

:where(img, svg, video, canvas) {
	height: auto;
	max-width: 100%;
}

.wp-site-blocks {
	min-height: 100vh;
}

.wp-block-navigation a {
	min-height: 44px;
}

/* Approved public header identity and navigation. */
.jho-site-header {
	background: var(--wp--preset--color--base);
	border-bottom: 1px solid var(--wp--preset--color--surface);
}

.jho-header-inner {
	gap: 1rem;
	min-height: 4.75rem;
}

.jho-wordmark {
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	text-decoration: none;
}

.jho-header-actions {
	gap: 0.5rem 1rem;
}

/* Local homepage composition. These styles intentionally do not add a form transport. */
.jho-homepage {
	--jho-paper: #f7f4ee;
	--jho-sage: #dce7df;
	--jho-clay: #8e432d;
	--jho-muted: #4d5d57;
	background: var(--jho-paper);
}

.jho-hero,
.jho-section {
	padding-block: clamp(3.5rem, 8vw, 7rem);
}

.jho-hero {
	background: var(--jho-sage);
}

.jho-hero-layout,
.jho-section .wp-block-columns {
	gap: clamp(2rem, 5vw, 5rem);
}

@media (min-width: 782px) {
	.jho-hero-layout > .wp-block-column {
		align-self: flex-start;
	}

	.jho-how-it-works .jho-card-grid {
		gap: 2rem;
	}

	.jho-as-is .jho-card-grid,
	.jho-inherited .jho-card-grid,
	.jho-rental .jho-card-grid,
	.jho-about .jho-card-grid {
		gap: 2rem;
	}

	.jho-how-it-works .jho-card-grid > .wp-block-column {
		flex-basis: 0;
		flex-grow: 1;
	}

	.jho-as-is .jho-card-grid > .wp-block-column,
	.jho-inherited .jho-card-grid > .wp-block-column,
	.jho-rental .jho-card-grid > .wp-block-column,
	.jho-about .jho-card-grid > .wp-block-column {
		flex-basis: 0;
		flex-grow: 1;
	}
}

.jho-homepage h1,
.jho-homepage h2,
.jho-homepage h3 {
	letter-spacing: -0.035em;
}

.jho-homepage h1 {
	font-size: clamp(2.75rem, 5vw, 4.8rem);
	line-height: 1.04;
}

.jho-homepage h2 {
	font-size: clamp(2rem, 3.5vw, 3.3rem);
	line-height: 1.08;
}

.jho-eyebrow,
.jho-card-number {
	color: var(--jho-clay);
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.jho-lede {
	font-size: 1.18rem;
}

.jho-check-list,
.jho-process-list {
	padding-left: 1.25rem;
}

.jho-check-list li,
.jho-process-list li {
	margin-block: 0.75rem;
}

.jho-review-panel,
.jho-card,
.jho-comparison {
	background: var(--wp--preset--color--base);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 15%, transparent);
	border-radius: 0.35rem;
	box-shadow: 0 1rem 2.5rem rgb(16 45 43 / 10%);
}

.jho-review-panel {
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

.jho-review-form p {
	margin-block: 0 1rem;
}


.jho-review-form label {
	display: block;
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: 0.9rem;
	font-weight: 700;
	margin-bottom: 0.35rem;
}

.jho-review-form input,
.jho-review-form select {
	border: 1px solid var(--wp--preset--color--contrast);
	border-radius: 0.2rem;
	box-sizing: border-box;
	font: inherit;
	min-height: 44px;
	padding: 0.6rem 0.7rem;
	width: 100%;
}

.jho-review-form button {
	background: var(--wp--preset--color--primary);
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: 999px;
	color: var(--wp--preset--color--base);
	cursor: pointer;
	font: inherit;
	font-weight: 700;
	min-height: 44px;
	padding: 0.7rem 1rem;
}

.jho-form-status,
.jho-review-privacy,
.jho-fine-print {
	color: var(--jho-muted);
	font-size: 0.9rem;
}

.jho-card-grid {
	margin-top: 2rem;
}

.jho-card {
	height: 100%;
	padding: 1.5rem;
}

/* How It Works follows the homepage's tighter content rhythm. */
.jho-how-it-works .jho-hero,
.jho-how-it-works .jho-section {
	padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

.jho-how-it-works .jho-card-grid {
	gap: 1.5rem;
	margin-top: 1.5rem;
	max-width: none;
	width: 100%;
}

.jho-how-it-works .jho-card-grid > .wp-block-column {
	display: flex;
}

.jho-how-it-works .jho-card {
	height: auto;
	min-height: 100%;
	overflow: visible;
	width: 100%;
}

/* The educational selling-situation pages share a compact, wide composition. */
.jho-as-is .jho-hero,
.jho-as-is .jho-section,
.jho-inherited .jho-hero,
.jho-inherited .jho-section,
.jho-rental .jho-hero,
.jho-rental .jho-section,
.jho-about .jho-hero,
.jho-about .jho-section {
	padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

.jho-as-is .jho-card-grid,
.jho-inherited .jho-card-grid,
.jho-rental .jho-card-grid,
.jho-about .jho-card-grid {
	gap: 1.5rem;
	margin-top: 1.5rem;
	max-width: none;
	width: 100%;
}

.jho-as-is .jho-card-grid > .wp-block-column,
.jho-inherited .jho-card-grid > .wp-block-column,
.jho-rental .jho-card-grid > .wp-block-column,
.jho-about .jho-card-grid > .wp-block-column {
	display: flex;
}

.jho-as-is .jho-card,
.jho-inherited .jho-card,
.jho-rental .jho-card,
.jho-about .jho-card {
	height: auto;
	min-height: 100%;
	overflow: visible;
	width: 100%;
}

.jho-as-is .jho-card,
.jho-as-is .jho-comparison,
.jho-as-is p,
.jho-as-is h1,
.jho-as-is h2,
.jho-as-is h3,
.jho-inherited .jho-card,
.jho-inherited .jho-comparison,
.jho-inherited p,
.jho-inherited h1,
.jho-inherited h2,
.jho-inherited h3,
.jho-rental .jho-card,
.jho-rental .jho-comparison,
.jho-rental p,
.jho-rental h1,
.jho-rental h2,
.jho-rental h3,
.jho-about .jho-card,
.jho-about .jho-comparison,
.jho-about p,
.jho-about h1,
.jho-about h2,
.jho-about h3 {
	hyphens: none;
	overflow-wrap: normal;
	word-break: normal;
}

.jho-nowrap {
	white-space: nowrap;
}

.jho-as-is-notice,
.jho-inherited-notice,
.jho-rental-notice {
	padding-top: 0;
}

.jho-process,
.jho-final-cta {
	background: var(--wp--preset--color--base);
}

.jho-comparison {
	padding: 1.5rem;
}

.jho-comparison h3:not(:first-child) {
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 15%, transparent);
	margin-top: 1.5rem;
	padding-top: 1.5rem;
}

/* Contact uses the same compact page rhythm without a lead form. */
.jho-contact .jho-hero,
.jho-contact .jho-section {
	padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

@media (max-width: 600px) {
	.wp-block-navigation__responsive-container-open {
		min-height: 44px;
		min-width: 44px;
	}

	.wp-block-navigation__responsive-container-open:focus-visible {
		outline-offset: -3px;
	}
}

@media (max-width: 700px) {
	.jho-hero,
	.jho-section {
		padding-block: 3.5rem;
	}

	.jho-review-panel {
		padding: 1.25rem;
	}

}