/* WordPress integration and interactive states layered over the original site CSS. */

html {
	overflow-x: hidden;
}

body {
	margin: 0;
	overflow-x: hidden;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
[type="button"],
[type="submit"] {
	cursor: pointer;
}

iframe {
	border: 0;
}

.site-header {
	color: var(--color-foreground);
}

.site-header.is-scrolled,
.site-header.menu-open {
	border-color: var(--color-border);
	background: color-mix(in oklab, var(--color-background) 90%, transparent);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	color: var(--color-foreground);
}

.site-header.home-transparent:not(.is-scrolled):not(.menu-open) {
	color: var(--color-ink-foreground);
}

.site-header.home-transparent:not(.is-scrolled):not(.menu-open) .hot-brand-subtitle {
	color: color-mix(in oklab, var(--color-ink-foreground) 70%, transparent);
}

.hot-header-book {
	border-color: var(--color-foreground);
}

.hot-header-book:hover {
	background: var(--color-foreground);
	color: var(--color-background);
}

.site-header.home-transparent:not(.is-scrolled):not(.menu-open) .hot-header-book {
	border-color: color-mix(in oklab, var(--color-ink-foreground) 60%, transparent);
}

.site-header.home-transparent:not(.is-scrolled):not(.menu-open) .hot-header-book:hover {
	background: var(--color-ink-foreground);
	color: var(--color-ink);
}

.hot-mobile-menu {
	background: color-mix(in oklab, var(--color-background) 96%, transparent);
	color: var(--color-foreground);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}

.hot-menu-icon > span {
	position: absolute;
	left: 0;
	display: block;
	height: 1px;
	width: 1.5rem;
	background: currentColor;
	transition: transform 300ms ease, top 300ms ease;
}

.hot-menu-icon > span:first-child {
	top: 0;
}

.hot-menu-icon > span:last-child {
	top: 0.75rem;
}

.site-header.menu-open .hot-menu-icon > span:first-child {
	top: 0.375rem;
	transform: rotate(45deg);
}

.site-header.menu-open .hot-menu-icon > span:last-child {
	top: 0.375rem;
	transform: rotate(-45deg);
}

.hot-custom-logo img {
	display: block;
	width: auto;
	max-width: 250px;
	height: 52px;
	object-fit: contain;
}

.hot-hero-overlay {
	background: linear-gradient(180deg, oklch(18.5% 0 0 / 0.55) 0%, oklch(18.5% 0 0 / 0.25) 45%, oklch(18.5% 0 0 / 0.75) 100%);
}

#hot-scroll-progress {
	width: 0;
}

.hot-skip-link {
	position: fixed;
	top: -100px;
	left: 1rem;
	z-index: 100000;
	background: var(--color-foreground);
	color: var(--color-background);
	padding: 0.75rem 1rem;
	font-size: 0.8rem;
}

.hot-skip-link:focus {
	top: 1rem;
}

.hot-js .hot-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 900ms var(--ease-editorial) var(--hot-delay, 0ms), transform 900ms var(--ease-editorial) var(--hot-delay, 0ms);
}

.hot-js .hot-reveal.is-visible {
	opacity: 1;
	transform: none;
}

.hot-field {
	width: 100%;
	border: 0;
	border-bottom: 1px solid var(--color-border);
	background: transparent;
	padding: 0.75rem 0;
	font-size: 1rem;
	outline: none;
	transition: border-color 250ms ease;
	color: var(--color-foreground);
}

.hot-field::placeholder {
	color: var(--color-muted-foreground);
}

.hot-field:focus {
	border-color: var(--color-accent);
}

select.hot-field option {
	color: #222;
	background: #fff;
}

.hot-honeypot {
	position: absolute !important;
	left: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.hot-form-error {
	border-left: 2px solid var(--color-destructive);
	padding: 0.85rem 1rem;
	background: color-mix(in oklab, var(--color-destructive) 8%, transparent);
	color: var(--color-foreground);
	font-size: 0.875rem;
}

.hot-project-item[hidden],
.hot-no-projects[hidden],
.hot-lightbox[hidden],
.hot-mobile-menu[hidden] {
	display: none !important;
}

body.hot-lightbox-active,
body.hot-menu-active {
	overflow: hidden;
}

.hot-entry-content > * + * {
	margin-top: 1.25rem;
}

.hot-entry-content h2,
.hot-entry-content h3 {
	font-family: var(--font-display);
	color: var(--color-foreground);
	font-weight: 300;
}

.hot-entry-content h2 {
	font-size: 2rem;
}

.hot-entry-content a {
	border-bottom: 1px solid currentColor;
}

body.admin-bar .site-header,
body.admin-bar #hot-scroll-progress-wrap {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .site-header,
	body.admin-bar #hot-scroll-progress-wrap {
		top: 46px;
	}
}

@media (max-width: 640px) {
	.hot-custom-logo img {
		max-width: 190px;
		height: 44px;
	}
}

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

	.hot-js .hot-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

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