/**
 * Shared production foundation.
 *
 * This file owns resets, design tokens, WordPress layout normalization and the
 * common interior-page primitives. Header, footer and page-specific styling
 * live in their own files.
 */

:root {
	--th-coral: #c7483e;
	--th-coral-dark: #a93a33;
	--th-ink: #172023;
	--th-cream: #f5f1ea;
	--th-muted: #657073;
	--th-line: #e4ded6;
	--th-white: #ffffff;
	--th-shell-width: 1180px;
	/* Backwards-compatible aliases used by the existing page markup. */
	--coral: var(--th-coral);
	--ink: var(--th-ink);
	--cream: var(--th-cream);
	--muted: var(--th-muted);
	--line: var(--th-line);
}

html {
	max-width: 100%;
	overflow-x: clip;
	scroll-behavior: smooth;
}

body {
	max-width: 100%;
	margin: 0;
	overflow-x: clip;
}

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

/* Child templates intentionally contain only project content. */
.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks > footer.wp-block-template-part,
.wp-block-post-title {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.wp-site-blocks,
.wp-block-post-content,
.entry-content,
main.wp-block-group {
	width: 100% !important;
	max-width: none !important;
	margin-block: 0 !important;
	padding-block: 0 !important;
	gap: 0 !important;
	row-gap: 0 !important;
}

/* Custom HTML is the page root for all project pages. Twenty Twenty-Five
 * otherwise constrains this block to its content width. */
.wp-block-html {
	width: 100vw !important;
	max-width: none !important;
	margin-top: 0 !important;
	margin-right: calc(50% - 50vw) !important;
	margin-bottom: 0 !important;
	margin-left: calc(50% - 50vw) !important;
	padding: 0 !important;
}

.wp-block-post-content > *,
.entry-content > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.th-nav-shell,
.th-footer {
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

/* Shared interior-page system. */
.p-site {
	width: 100%;
	max-width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	color: var(--th-ink);
	line-height: 1.65;
}

.c-site {
	width: 100%;
	max-width: 100%;
}

.p-hero,
.p-section,
.p-cta,
.b-wrap,
.r-wrap,
.c-hero,
.c-main {
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

.p-container {
	width: min(var(--th-shell-width), calc(100% - 40px)) !important;
	max-width: calc(100% - 40px) !important;
	margin-inline: auto !important;
}

.p-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 24px;
	border: 0;
	border-radius: 999px;
	background: var(--th-coral);
	color: var(--th-white) !important;
	font-size: 0.7rem;
	font-weight: 900;
	letter-spacing: 0.1em;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
}

.p-btn:hover {
	background: var(--th-coral-dark);
}

.p-hero {
	padding: 112px 0 92px;
	background: var(--th-cream);
}

.p-eyebrow {
	color: var(--th-coral);
	font-size: 0.72rem;
	font-weight: 900;
	letter-spacing: 0.17em;
	text-transform: uppercase;
}

.p-hero h1,
.p-section h2 {
	font-family: Georgia, serif;
	line-height: 1.01;
	letter-spacing: -0.045em;
}

.p-hero h1 {
	max-width: 970px;
	margin: 18px 0 26px;
	font-size: clamp(3.5rem, 7vw, 7.2rem);
}

.p-hero p {
	max-width: 720px;
	margin: 0;
	color: var(--th-muted);
	font-size: 1.08rem;
	line-height: 1.75;
}

.p-section {
	padding: 92px 0;
}

.p-section h2 {
	margin: 14px 0 22px;
	font-size: clamp(2.6rem, 4vw, 4.3rem);
}

.p-lead {
	max-width: 720px;
	color: var(--th-muted);
	font-size: 1rem;
	line-height: 1.75;
}

.p-cta {
	padding: 92px 20px;
	background: var(--th-ink);
	color: var(--th-white);
	text-align: center;
}

.p-cta h2 {
	max-width: 850px;
	margin: 15px auto 22px;
	font-family: Georgia, serif;
	font-size: clamp(2.7rem, 5vw, 5rem);
	line-height: 1;
}

.p-cta p {
	max-width: 650px;
	margin: 0 auto 30px;
	color: #c2cbcc;
}

.p-note {
	padding: 16px 20px;
	border: 1px solid #f4d1cb;
	border-radius: 10px;
	background: #fff2ef;
	color: #9f4d44;
	font-size: 0.8rem;
}

/* Shared floating actions. Home provides the same markup inside its content;
 * interior pages receive it from functions.php. Booking intentionally does not. */
.th-floating-actions {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 60;
	display: flex;
	align-items: center;
	gap: 11px;
}

.th-float-book,
.th-back-top {
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 12px 34px rgba(20, 29, 31, 0.18);
}

.th-float-book {
	width: 78px;
	height: 78px;
	border-radius: 50%;
	background: var(--th-coral);
	color: var(--th-white) !important;
	font-size: 0.76rem;
	font-weight: 900;
	letter-spacing: 0.12em;
	line-height: 1.05;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

.th-float-book:hover {
	background: var(--th-coral-dark);
}

.th-back-top {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--th-ink);
	color: var(--th-white) !important;
	font-size: 1.35rem;
	text-decoration: none;
}

.th-back-top span {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

.th-floating-actions.is-over-hero {
	opacity: 0;
	pointer-events: none;
	transform: translateY(14px);
}

.th-floating-actions {
	transition: opacity 0.2s ease, transform 0.2s ease;
}

@media (max-width: 680px) {
	.th-floating-actions {
		right: 14px;
		bottom: 16px;
		gap: 8px;
	}
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--th-coral) !important;
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto !important;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

@media (max-width: 850px) {
	.p-hero {
		padding: 85px 0 70px;
	}
}

@media (max-width: 620px) {
	.p-section {
		padding: 68px 0;
	}

	.p-hero h1 {
		font-size: 3.35rem;
	}
}