/*
 * Blockwist presentation layer.
 * Structural choices live in theme.json; this file handles interactions and
 * reusable treatments that theme.json cannot express cleanly.
 */

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

html {
	scroll-behavior: smooth;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img {
	height: auto;
	max-width: 100%;
}

a {
	text-underline-offset: 0.18em;
	text-decoration-thickness: 0.08em;
	transition: color var(--wp--custom--transition), opacity var(--wp--custom--transition);
}

a:hover {
	text-decoration: underline;
}

:focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

::selection {
	background: var(--wp--preset--color--highlight);
	color: var(--wp--preset--color--dark);
}

pre {
	max-width: 100%;
	overflow-x: auto;
}

.wp-block-comment-content {
	min-width: 0;
	overflow-wrap: anywhere;
}

input,
textarea,
select {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--small);
	color: var(--wp--preset--color--contrast);
	font: inherit;
	padding: 0.75rem 0.9rem;
}

input::placeholder,
textarea::placeholder {
	color: var(--wp--preset--color--muted);
	opacity: 1;
}

textarea {
	width: 100%;
}

/* Pattern-builder pages intentionally place top-level sections flush together. */
.blockwist-pattern-builder .wp-block-post-content {
	--wp--style--block-gap: 0;
}

.blockwist-pattern-builder .wp-block-post-content > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

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

.wp-element-button,
.wp-block-button__link {
	transition: background-color var(--wp--custom--transition), color var(--wp--custom--transition), border-color var(--wp--custom--transition), filter var(--wp--custom--transition);
}

.wp-element-button:hover,
.wp-block-button__link:hover {
	filter: brightness(0.96);
	text-decoration: none;
}

.wp-block-button.is-style-outline .wp-block-button__link,
.wp-element-button.is-style-outline {
	background: transparent;
	border-color: currentColor;
	border-style: solid;
	border-width: 1px;
}

.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
.wp-element-button.is-style-outline:not(.has-text-color) {
	color: var(--wp--preset--color--accent);
}

.wp-block-button.is-style-soft .wp-block-button__link {
	background: var(--wp--preset--color--accent-soft);
	border-color: transparent;
}

.wp-block-button.is-style-soft .wp-block-button__link:not(.has-text-color) {
	color: var(--wp--preset--color--accent);
}

.wp-block-button.is-style-text .wp-block-button__link {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0.4rem 0;
}

.wp-block-button.is-style-text .wp-block-button__link:not(.has-text-color) {
	color: var(--wp--preset--color--accent);
}

.wp-block-button.is-style-text .wp-block-button__link::after {
	content: " \2192";
}

.wp-block-group.is-style-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--medium);
	box-shadow: var(--wp--preset--shadow--soft);
	color: var(--wp--preset--color--contrast);
	padding: var(--wp--preset--spacing--md);
}

.wp-block-group.is-style-glass {
	backdrop-filter: blur(18px);
	background: color-mix(in srgb, var(--wp--preset--color--surface) 78%, transparent);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--surface) 60%, transparent);
	border-radius: var(--wp--custom--radius--large);
	box-shadow: var(--wp--preset--shadow--soft);
}

.wp-block-image.is-style-lifted img {
	border-radius: var(--wp--custom--radius--large);
	box-shadow: var(--wp--preset--shadow--lifted);
}

.wp-block-list.is-style-checkmarks {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-checkmarks li {
	padding-left: 1.75em;
	position: relative;
}

.wp-block-list.is-style-checkmarks li + li {
	margin-top: 0.65em;
}

.wp-block-list.is-style-checkmarks li::before {
	color: var(--wp--preset--color--accent);
	content: "\2713";
	font-weight: 800;
	left: 0;
	position: absolute;
}

.wp-block-separator.is-style-short {
	margin-left: 0;
	width: 4rem;
}

.blockwist-eyebrow {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.blockwist-icon {
	align-items: center;
	background: var(--wp--preset--color--accent-soft);
	border-radius: var(--wp--custom--radius--small);
	color: var(--wp--preset--color--accent);
	display: inline-flex;
	font-weight: 750;
	height: 2.75rem;
	justify-content: center;
	width: 2.75rem;
}

.blockwist-post-card {
	height: 100%;
}

.blockwist-post-card .wp-block-post-featured-image img {
	transition: transform 500ms cubic-bezier(.2,.7,.2,1);
}

.blockwist-post-card:hover .wp-block-post-featured-image img {
	transform: scale(1.025);
}

.blockwist-header {
	position: relative;
	z-index: 20;
}

.wp-site-blocks > header + * {
	margin-block-start: 0;
}

.wp-site-blocks > footer.wp-block-template-part {
	margin-block-start: 0;
}

.blockwist-footer a {
	color: inherit;
}

.blockwist-builder-header .wp-block-site-title a,
.blockwist-builder-footer .wp-block-site-title a {
	color: inherit;
	text-decoration: none;
}

.blockwist-builder-header__actions,
.blockwist-builder-footer__inner,
.blockwist-builder-footer__identity {
	gap: var(--wp--preset--spacing--sm);
}

.blockwist-builder-hero h1 {
	max-width: 10ch;
}

.blockwist-builder-hero__artwork {
	margin: 0;
}

.blockwist-builder-hero__artwork img {
	display: block;
	max-height: 44rem;
	object-fit: contain;
	width: 100%;
}

.blockwist-builder-features__columns > .wp-block-column {
	border-inline-start: 1px solid color-mix(in srgb, currentColor 15%, transparent);
	padding-inline-start: var(--wp--preset--spacing--sm);
}

.blockwist-feature-icon {
	color: var(--wp--preset--color--accent);
	display: inline-flex;
	height: 2rem;
	width: 2rem;
}

.blockwist-feature-icon svg {
	display: block;
	height: 100%;
	width: 100%;
}

.blockwist-builder-cta--dark {
	background-image: linear-gradient(110deg, var(--wp--preset--color--dark), color-mix(in srgb, var(--wp--preset--color--accent) 18%, var(--wp--preset--color--dark)));
}

.blockwist-builder-cta__inner {
	gap: var(--wp--preset--spacing--md);
}

.blockwist-builder-dark {
	--blockwist-dark-accent: var(--wp--preset--color--on-dark);
	background-color: var(--wp--preset--color--dark);
}

@supports (color: color-mix(in srgb, white, black)) {
	.blockwist-builder-dark {
		--blockwist-dark-accent: color-mix(in srgb, var(--wp--preset--color--accent) 50%, var(--wp--preset--color--on-dark));
	}
}

.blockwist-builder-dark .has-accent-color {
	color: var(--blockwist-dark-accent) !important;
}

.blockwist-builder-dark .blockwist-feature-icon {
	color: var(--blockwist-dark-accent);
}

.blockwist-builder-dark :focus-visible {
	outline-color: var(--blockwist-dark-accent);
}

.blockwist-builder-dark .wp-block-heading:not(.has-text-color),
.blockwist-builder-dark a:not(.wp-element-button):not(.has-text-color) {
	color: inherit;
}

.blockwist-builder-dark .wc-block-mini-cart__button,
.blockwist-builder-dark .wc-block-mini-cart__icon,
.blockwist-builder-dark .wp-block-navigation__responsive-container-open,
.blockwist-builder-dark .wp-block-navigation__responsive-container-close,
.blockwist-builder-dark .wp-block-search__button {
	color: inherit;
}

.blockwist-builder-dark .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: currentColor;
}

.blockwist-builder-dark .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
.blockwist-builder-dark .wp-element-button.is-style-outline:not(.has-text-color) {
	color: var(--wp--preset--color--on-dark);
}

.blockwist-builder-footer.blockwist-builder-dark {
	border-top-color: color-mix(in srgb, currentColor 15%, transparent) !important;
}

.wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--sm);
}

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

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

@media (max-width: 781px) {
	.blockwist-stack-mobile {
		grid-template-columns: 1fr !important;
	}

	.blockwist-builder-hero__columns {
		gap: var(--wp--preset--spacing--sm);
	}

	.blockwist-builder-hero__artwork img {
		max-height: 34rem;
	}

	.blockwist-builder-features__columns > .wp-block-column {
		padding-block: var(--wp--preset--spacing--xs);
	}

	.blockwist-builder-footer__inner {
		align-items: flex-start;
		flex-direction: column;
	}
}

@media (max-width: 600px) {
	.blockwist-builder-header .blockwist-builder-header__cta {
		display: none;
	}

	.blockwist-builder-cta__inner {
		align-items: flex-start;
		flex-direction: column;
	}
}
