/* Thornveil parent — lean front-end. Tokens from theme.json. */

:root {
	--tv-ink: #0b090a;
	--tv-surface: #161113;
	--tv-fg: #efe6dc;
	--tv-muted: #8f8079;
	--tv-gold: #c9a56a;
	--tv-border: rgb(239 230 220 / 10%);
}

html {
	background: var(--tv-ink);
	color: var(--tv-fg);
	-webkit-font-smoothing: antialiased;
}

body {
	background: var(--tv-ink);
	color: var(--tv-fg);
}

a:focus-visible,
button:focus-visible {
	outline: 2px solid var(--tv-gold);
	outline-offset: 3px;
}

.skip-link {
	position: absolute;
	left: -999px;
	top: 0;
	background: var(--tv-gold);
	color: var(--tv-ink);
	padding: 0.5rem 1rem;
	z-index: 100;
}
.skip-link:focus {
	left: 1rem;
	top: 1rem;
}

/* Cinematic hero — used when the cover block has no uploaded image. */
.home .wp-block-cover,
.page-template-page-cinematic .wp-block-cover {
	background-color: var(--tv-ink);
	background-image: url("../images/hero.jpg");
	background-size: cover;
	background-position: center 28%;
	min-height: 88vh;
}
.home .wp-block-cover .wp-block-cover__background,
.page-template-page-cinematic .wp-block-cover .wp-block-cover__background {
	background-color: rgb(11 9 10 / 0.42) !important;
	opacity: 1 !important;
}

.wp-block-site-title a {
	text-decoration: none;
	color: inherit;
}

.wp-element-button,
.wp-block-button__link {
	background: var(--tv-gold) !important;
	color: var(--tv-ink) !important;
	border-radius: 2px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-size: 0.8125rem;
	font-weight: 500;
	padding: 0.7rem 1.15rem;
	text-decoration: none;
}

.tv-masonry {
	column-count: 1;
	column-gap: 1rem;
}
@media (min-width: 640px) {
	.tv-masonry { column-count: 2; }
}
@media (min-width: 1100px) {
	.tv-masonry { column-count: 3; }
}
.tv-masonry-item,
.tv-masonry .wp-block-post {
	break-inside: avoid;
	margin-bottom: 1rem;
	content-visibility: auto;
	contain-intrinsic-size: 400px 520px;
}

.wp-block-video video,
.single-cinema video {
	width: 100%;
	height: auto;
	background: #0b090a;
	display: block;
}

.tv-card img,
.wp-block-post-featured-image img {
	width: 100%;
	height: auto;
	outline: 1px solid var(--tv-border);
	outline-offset: -1px;
}

.tv-meta {
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--tv-muted);
}

.tv-prompt {
	font-size: 0.95rem;
	line-height: 1.55;
	margin-top: 1.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--tv-border);
}
.tv-prompt dt {
	font-size: 0.7rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--tv-gold);
	margin-top: 0.85rem;
}
.tv-prompt dd {
	margin: 0.35rem 0 0;
	color: var(--tv-muted);
}

/* Keep words whole in the right-hand artwork panel. */
h1, h2, h3, h4, .wp-block-post-title, .wp-block-query-title {
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
	-webkit-hyphens: none;
}
.tv-artwork-meta .wp-block-post-title,
.single-artwork .wp-block-column:last-child .wp-block-post-title {
	font-size: clamp(2rem, 3.4vw, 3.15rem);
	line-height: 1.08;
	letter-spacing: -0.015em;
}

.wp-site-blocks > header {
	border-bottom: 1px solid var(--tv-border);
	background: rgb(11 9 10 / 0.88);
	position: sticky;
	top: 0;
	z-index: 40;
	backdrop-filter: blur(10px);
}

.wp-site-blocks > footer {
	border-top: 1px solid var(--tv-border);
	margin-top: 3rem;
}

.wp-block-navigation a {
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-size: 0.8125rem;
	text-decoration: none;
}

/* Desktop: show the menu inline. WooCommerce/Elementor can force the overlay. */
@media (min-width: 782px) {
	.wp-block-navigation__responsive-container-open {
		display: none !important;
	}
	.wp-block-navigation__responsive-container-close {
		display: none !important;
	}
	.wp-block-navigation__responsive-container:not(.hidden-by-default),
	.wp-block-navigation__responsive-container.hidden-by-default:not(.is-menu-open) {
		display: flex !important;
		position: static !important;
		width: auto !important;
		height: auto !important;
		overflow: visible !important;
		background: transparent !important;
	}
	.wp-block-navigation__responsive-close,
	.wp-block-navigation__responsive-dialog,
	.wp-block-navigation__responsive-container-content {
		display: flex !important;
		position: static !important;
		padding: 0 !important;
		overflow: visible !important;
		width: auto !important;
		height: auto !important;
	}
}

/*
 * WooCommerce injects a mini-cart drawer into block themes.
 * On this site it was rendering as a full-screen “empty basket” overlay.
 */
body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) .wc-block-components-drawer__screen-overlay,
body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) .wc-block-mini-cart__drawer,
body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) .wc-block-mini-cart__overlay,
.wp-block-woocommerce-mini-cart {
	display: none !important;
	pointer-events: none !important;
	opacity: 0 !important;
	visibility: hidden !important;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}
}