:root {
	--kopylov-font-family-base: "Inter Tight", "Inter", "Segoe UI", sans-serif;
	--kopylov-text-font-size: 2rem;
	--kopylov-text-line-height: 1.4;
	--kopylov-h1-font-size: 72px;
	--kopylov-h1-line-height: 1;
	--kopylov-h-hero-font-size: 192px;
	--kopylov-h-hero-line-height: 0.9;
	--kopylov-h-hero-letter-spacing: -0.04em;
	--kopylov-h2-font-size: 40px;
	--kopylov-h2-line-height: 1.1;
	--kopylov-h3-font-size: 25px;
	--kopylov-h3-line-height: 1.2;
	--kopylov-h4-font-size: 18px;
	--kopylov-h4-line-height: 1.3;
	--kopylov-h5-font-size: 12px;
	--kopylov-h5-line-height: 1.4;
	--kopylov-h5-letter-spacing: 1px;
	--kopylov-link-hover-color: #8627ff;
	--kopylov-fill-button-bg: #8627ff;
	--kopylov-fill-button-text: #ffffff;
	--kopylov-fill-button-gap: 0px;
	--kopylov-fill-button-font-size: clamp(20px, 4vw, 48px);
	--kopylov-fill-button-inline: clamp(44px, 6vw, 80px);
	--kopylov-fill-button-block-start: 6px;
	--kopylov-fill-button-block-end: 10px;
	--kopylov-fill-button-arrow-side: clamp(16px, 2vw, 24px);
	--kopylov-fill-button-radius: 999px;
	--kopylov-fill-button-hover-text: var(--wp--preset--color--contrast);
	--kopylov-outline-button-text: #ffffff;
	--kopylov-outline-button-border: #ffffff;
	--kopylov-outline-button-hover: #8627ff;
	--kopylov-outline-button-border-width: 2px;
	--kopylov-full-width-padded-desktop: 40px;
	--kopylov-full-width-padded-mobile: 16px;
	--kopylov-hero-screen-offset-desktop: calc(88px + var(--wp--preset--spacing--50));
	--kopylov-hero-screen-offset-mobile: calc(72px + var(--wp--preset--spacing--50));
	--kopylov-hero-flow-top-offset: calc(var(--wp--preset--spacing--30, 0px) + 40px + var(--wp--preset--spacing--40, 0px));
	--kopylov-cookie-consent-height: 0px;
	--kopylov-hero-bottom-gap: 0px;
	--kopylov-home-uxui-sticky-top: 90px;
	--kopylov-home-uxui-text-top: calc(90px + 40px);
}

:where(body, .editor-styles-wrapper) {
	font-family: var(--kopylov-font-family-base);
}

html,
body {
	overflow-x: hidden;
}

/* Keep the cookie plugin's re-consent control hidden on the public site. */
body .cookieadmin_re_consent {
	display: none !important;
}

@supports (overflow: clip) {
	html,
	body {
		overflow-x: clip;
	}
}

.wp-site-blocks {
	position: relative;
	z-index: 100;
}

header.wp-block-template-part {
	position: relative;
	z-index: 100000;
}

body.kopylov-header-fixed {
	--kopylov-fixed-header-height: 0px;
}

body.kopylov-header-fixed .wp-site-blocks {
	/* Preserve the theme's original top spacing when the header leaves the flow. */
	padding-top: calc(var(--kopylov-fixed-header-height) + var(--wp--preset--spacing--30, 0px));
}

body.kopylov-header-fixed header.wp-block-template-part {
	mix-blend-mode: difference;
	position: fixed;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + 2rem);
	right: 0;
	left: 0;
	width: 100%;
}

.custom-logo-inline {
	display: block;
	height: auto;
	max-width: 100%;
}

:where(body, .editor-styles-wrapper) :where(p, li, dd, dt, figcaption, cite, blockquote, .wp-block-paragraph, .wp-block-list, .wp-block-list li) {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-text-font-size);
	font-style: normal;
	font-weight: 500;
	line-height: var(--kopylov-text-line-height);
}

:where(body, .editor-styles-wrapper) a:not(.wp-element-button):not(.wp-block-button__link) {
	transition: color 0.5s ease;
}

:where(body, .editor-styles-wrapper) a:not(.wp-element-button):not(.wp-block-button__link):hover {
	color: var(--kopylov-link-hover-color) !important;
	text-decoration: none !important;
}

.wp-block-post-template .wp-block-post :is(.wp-block-post-title, .wp-block-post-title a, .wp-block-post-excerpt, .wp-block-post-excerpt p, .wp-block-post-date, .wp-block-post-date a) {
	transition: color 0.5s ease;
}

.wp-block-post-template .wp-block-post .wp-block-post-featured-image {
	overflow: hidden;
}

.wp-block-post-template .wp-block-post .wp-block-post-featured-image img {
	transform: scale(1);
	transform-origin: center center;
	transition: transform 0.5s ease;
}

.wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image img {
	transform: scale(1.2);
}

.wp-block-post-template .wp-block-post:hover :is(.wp-block-post-title, .wp-block-post-title a, .wp-block-post-excerpt, .wp-block-post-excerpt p, .wp-block-post-date, .wp-block-post-date a) {
	color: var(--kopylov-link-hover-color) !important;
	text-decoration: none !important;
}

/* The Portfolio Last 5 list uses a divider on each title except the final item. */
.portfolio-last-5-list > li:last-child .wp-block-post-title {
	border-bottom: none !important;
}

.portfolio-last-5-list .wp-block-post-title a {
	display: block;
	text-decoration: none;
}

/* Keep the featured image available to the cursor without changing the list layout. */
.portfolio-last-5-list .portfolio-last-5-preview-source {
	display: none !important;
}

.portfolio-last-5-preview-layer {
	inset: 0;
	overflow: visible;
	pointer-events: none;
	position: fixed;
	z-index: 2147483647;
}

.portfolio-last-5-preview-cursor {
	background: #ffffff;
	border: 0 solid #ffffff;
	border-radius: 40px;
	box-sizing: border-box;
	box-shadow: 0 10px 10px rgba(0, 0, 0, 0.5);
	height: 1px;
	left: 0;
	op: 0;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: fixed;
	transform: translate3d(-50%, -50%, 0) rotate(0deg);
	visibility: hidden;
	width: 1px;
	will-change: width, height, transform, opacity, border-radius, border-width;
	transition:
		width 500ms cubic-bezier(0.22, 1, 0.36, 1),
		height 500ms cubic-bezier(0.22, 1, 0.36, 1),
		border-radius 500ms cubic-bezier(0.22, 1, 0.36, 1),
		border-width 500ms cubic-bezier(0.22, 1, 0.36, 1),
		opacity 500ms ease,
		visibility 0s linear 500ms;
}

.portfolio-last-5-preview-cursor.is-visible {
	border-width: 4px;
	height: var(--kopylov-preview-height, 300px);
	opacity: 1;
	visibility: visible;
	width: var(--kopylov-preview-width, 480px);
	transition:
		width 500ms cubic-bezier(0.22, 1, 0.36, 1),
		height 500ms cubic-bezier(0.22, 1, 0.36, 1),
		border-radius 500ms cubic-bezier(0.22, 1, 0.36, 1),
		border-width 500ms cubic-bezier(0.22, 1, 0.36, 1),
		opacity 500ms ease,
		visibility 0s linear 0s;
}

.portfolio-last-5-preview-cursor img {
	display: block;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 180ms ease;
	width: 100%;
}

.portfolio-last-5-preview-cursor.is-ready img {
	opacity: 1;
	transition-delay: 120ms;
}

@media (hover: hover) and (pointer: fine) {
	body.kopylov-portfolio-preview-active .portfolio-last-5-list {
		cursor: none;
	}

	body.kopylov-portfolio-preview-cursor-enabled .portfolio-last-5-list .wp-block-post-title a {
		cursor: none;
	}
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
	.portfolio-last-5-preview-layer {
		display: none;
	}

	.portfolio-last-5-list .wp-block-post-title a {
		cursor: auto;
	}
}

:where(body, .editor-styles-wrapper) h1,
:where(body, .editor-styles-wrapper) .h1 {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-h1-font-size);
	font-style: normal;
	font-weight: 700;
	line-height: var(--kopylov-h1-line-height);
}

:where(body, .editor-styles-wrapper) .h1 {
	font-size: var(--kopylov-h1-font-size) !important;
}

:where(body, .editor-styles-wrapper) .h-hero,
:where(body, .editor-styles-wrapper) .hero-style-txt {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-h-hero-font-size);
	font-style: normal;
	font-weight: 700;
	line-height: var(--kopylov-h-hero-line-height);
	letter-spacing: var(--kopylov-h-hero-letter-spacing);
}

:where(body, .editor-styles-wrapper) .hero-style-txt {
	font-size: clamp(82.777px, 5.174rem + ((1vw - 3.2px) * 12.412), var(--kopylov-h-hero-font-size)) !important;
	text-transform: uppercase;
}

:where(body, .editor-styles-wrapper) h2,
:where(body, .editor-styles-wrapper) .h2 {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-h2-font-size);
	font-style: normal;
	font-weight: 600;
	line-height: var(--kopylov-h2-line-height);
}

:where(body, .editor-styles-wrapper) .h2 {
	font-size: var(--kopylov-h2-font-size) !important;
}

:where(body, .editor-styles-wrapper) h3,
:where(body, .editor-styles-wrapper) .h3 {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-h3-font-size);
	font-style: normal;
	font-weight: 700;
	line-height: var(--kopylov-h3-line-height);
}

:where(body, .editor-styles-wrapper) .h3 {
	font-size: var(--kopylov-h3-font-size) !important;
}

:where(body, .editor-styles-wrapper) h4,
:where(body, .editor-styles-wrapper) .h4 {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-h4-font-size);
	font-style: normal;
	font-weight: 600;
	line-height: var(--kopylov-h4-line-height);
}

:where(body, .editor-styles-wrapper) .h4 {
	font-size: var(--kopylov-h4-font-size) !important;
}

:where(body, .editor-styles-wrapper) h5,
:where(body, .editor-styles-wrapper) .h5 {
	font-family: var(--kopylov-font-family-base);
	font-size: var(--kopylov-h5-font-size);
	font-style: normal;
	font-weight: 700;
	line-height: var(--kopylov-h5-line-height);
	letter-spacing: var(--kopylov-h5-letter-spacing);
	text-transform: uppercase;
}

:where(body, .editor-styles-wrapper) .h5 {
	font-size: var(--kopylov-h5-font-size) !important;
}

/* Make the Content Views title tag use the corresponding theme typography. */
.pt-cv-wrapper h1.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--kopylov-h1-font-size) !important;
	font-style: normal !important;
	font-weight: 700 !important;
	line-height: var(--kopylov-h1-line-height) !important;
	text-transform: inherit !important;
}

.pt-cv-wrapper h2.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--kopylov-h2-font-size) !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: var(--kopylov-h2-line-height) !important;
	text-transform: inherit !important;
}

.pt-cv-wrapper h3.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--kopylov-h3-font-size) !important;
	font-style: normal !important;
	font-weight: 700 !important;
	line-height: var(--kopylov-h3-line-height) !important;
	text-transform: inherit !important;
}

.pt-cv-wrapper h4.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--kopylov-h4-font-size) !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: var(--kopylov-h4-line-height) !important;
	text-transform: inherit !important;
}

.pt-cv-wrapper h5.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--kopylov-h5-font-size) !important;
	font-style: normal !important;
	font-weight: 700 !important;
	line-height: var(--kopylov-h5-line-height) !important;
	letter-spacing: var(--kopylov-h5-letter-spacing) !important;
	text-transform: uppercase !important;
}

.pt-cv-wrapper h6.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--wp--preset--font-size--medium, var(--kopylov-text-font-size)) !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: inherit !important;
	text-transform: uppercase !important;
}

.pt-cv-wrapper p.pt-cv-title,
.pt-cv-wrapper div.pt-cv-title {
	font-family: var(--kopylov-font-family-base) !important;
	font-size: var(--kopylov-text-font-size) !important;
	font-style: normal !important;
	font-weight: 500 !important;
	line-height: var(--kopylov-text-line-height) !important;
}

.pt-cv-wrapper h1.pt-cv-title a,
.pt-cv-wrapper h2.pt-cv-title a,
.pt-cv-wrapper h3.pt-cv-title a,
.pt-cv-wrapper h4.pt-cv-title a,
.pt-cv-wrapper h5.pt-cv-title a,
.pt-cv-wrapper h6.pt-cv-title a,
.pt-cv-wrapper p.pt-cv-title a,
.pt-cv-wrapper div.pt-cv-title a {
	font-family: inherit !important;
	font-size: inherit !important;
	font-style: inherit !important;
	font-weight: inherit !important;
	letter-spacing: inherit !important;
	line-height: inherit !important;
	text-transform: inherit !important;
	color: inherit !important;
}

.alignfull.is-kopylov-full-width-padded {
	box-sizing: border-box;
	padding-left: var(--kopylov-full-width-padded-desktop) !important;
	padding-right: var(--kopylov-full-width-padded-desktop) !important;
}

/*
 * The Post Content block is rendered inside a flow layout in the single and
 * page templates. In that context WordPress adds the align class but does not
 * constrain the block itself, so its width control appears to have no effect.
 * Keep the fix scoped to Post Content and let explicitly aligned inner blocks
 * retain their own width choices.
 */
.wp-block-post-content.alignwide {
	box-sizing: border-box;
	width: 100% !important;
	max-width: var(--wp--style--global--wide-size) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.wp-block-post-content.alignfull {
	box-sizing: border-box;
	width: auto !important;
	max-width: none !important;
}

.wp-block-post-content.alignwide.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: var(--wp--style--global--wide-size) !important;
}

.wp-block-post-content.alignfull.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none !important;
}

.is-kopylov-max-width-420 {
	box-sizing: border-box;
	max-width: 420px !important;
	width: min(100%, 420px);
}

.is-kopylov-max-width-420:not(.alignleft):not(.alignright) {
	margin-left: auto !important;
	margin-right: auto !important;
}

.is-kopylov-max-width-420.alignleft {
	margin-right: auto !important;
}

.is-kopylov-max-width-420.alignright {
	margin-left: auto !important;
}

.hero-screen {
	min-height: calc(100vh - var(--kopylov-hero-flow-top-offset) - var(--wp-admin--admin-bar--height, 0px) - var(--kopylov-hero-bottom-gap));
	min-height: calc(100lvh - var(--kopylov-hero-flow-top-offset) - var(--wp-admin--admin-bar--height, 0px) - var(--kopylov-hero-bottom-gap));
	align-items: flex-end !important;
}

.full-screen-block {
	box-sizing: border-box;
	min-height: 100vh;
	min-height: 100lvh;
}

#home-uxui-design {
	position: relative;
	z-index: 12;
}

#home-uxui-design-h {
	position: relative;
	z-index: 1;
	margin-block-start: 0 !important;
	will-change: top;
}

#home-uxui-design-t1,
#home-uxui-design-t2,
#home-uxui-design-t3 {
	will-change: top, clip-path;
}

.hero-screen > .wp-block-column {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.hero-screen > .wp-block-column:first-child,
.hero-screen > .wp-block-column:last-child {
	justify-content: flex-end;
}

.hero-screen .wp-block-buttons {
	margin-top: auto;
}

.wp-block-navigation .wp-block-navigation-item__content {
	color: var(--wp--preset--color--secondary) !important;
	font-family: "Inter Tight", "Inter", "Segoe UI", sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	line-height: 16px;
	text-decoration: none !important;
	text-transform: lowercase;
	transition: color 0.5s ease;
}

.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible {
	color: var(--kopylov-link-hover-color) !important;
	text-decoration: none !important;
}

.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"] {
	color: var(--wp--preset--color--tertiary) !important;
}

.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content:focus-visible,
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"]:hover,
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"]:focus-visible {
	color: var(--kopylov-link-hover-color) !important;
}

.wp-block-navigation .wp-block-navigation__responsive-container-open {
	position: relative;
	z-index: 100001;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 24px;
}

.wp-block-navigation .wp-block-navigation__responsive-container-open .kopylov-navigation-burger-icon {
	display: block;
	width: 40px;
	height: 24px;
	fill: none;
	overflow: visible;
}

.wp-block-navigation .wp-block-navigation__responsive-container-open .kopylov-navigation-burger-icon .kopylov-navigation-icon__line {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	vector-effect: non-scaling-stroke;
	transform-box: view-box;
	transform-origin: 20px 12px;
	transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.wp-block-navigation .wp-block-navigation__responsive-container-open .kopylov-navigation-icon__line--top {
	transform: translateY(-5px);
}

.wp-block-navigation .wp-block-navigation__responsive-container-open .kopylov-navigation-icon__line--bottom {
	transform: translateY(5px);
}

.wp-block-navigation .wp-block-navigation__responsive-container-close {
	position: absolute;
	width: 0;
	height: 0;
	padding: 0;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
}

.wp-block-navigation.kopylov-menu-open .wp-block-navigation__responsive-container-open {
	position: fixed;
	top: var(--kopylov-menu-toggle-top, 0px);
	left: var(--kopylov-menu-toggle-left, 0px);
	color: var(--wp--preset--color--secondary) !important;
	z-index: 100001 !important;
}

.wp-block-navigation.kopylov-menu-open:not(.kopylov-menu-closing) .wp-block-navigation__responsive-container-open .kopylov-navigation-icon__line--top {
	transform: scaleX(0.8485) rotate(45deg);
}

.wp-block-navigation.kopylov-menu-open:not(.kopylov-menu-closing) .wp-block-navigation__responsive-container-open .kopylov-navigation-icon__line--bottom {
	transform: scaleX(0.8485) rotate(-45deg);
}

.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
	background-color: rgba(17, 17, 17, 0.95) !important;
}

@keyframes kopylov-mobile-menu-slide-left {
	from {
		opacity: 0;
		transform: translateX(100%);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes kopylov-mobile-menu-slide-right {
	from {
		opacity: 1;
		transform: translateX(0);
	}

	to {
		opacity: 0;
		transform: translateX(100%);
	}
}

@media not (prefers-reduced-motion) {
	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
		animation: kopylov-mobile-menu-slide-left 0.32s cubic-bezier(0.22, 1, 0.36, 1) both !important;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container.kopylov-is-closing {
		display: flex !important;
		flex-direction: column;
		background-color: rgba(17, 17, 17, 0.95) !important;
		animation: kopylov-mobile-menu-slide-right 0.32s cubic-bezier(0.22, 1, 0.36, 1) both !important;
	}
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	--kopylov-fill-button-arrow-width: var(--kopylov-arrow-inline-size, calc(1em + (var(--kopylov-fill-button-arrow-side) * 2)));
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: calc(1em + var(--kopylov-fill-button-block-start) + var(--kopylov-fill-button-block-end));
	padding-block-start: var(--kopylov-fill-button-block-start);
	padding-block-end: var(--kopylov-fill-button-block-end);
	padding-inline-start: var(--kopylov-fill-button-inline);
	padding-inline-end: calc(var(--kopylov-fill-button-inline) + var(--kopylov-fill-button-arrow-width) + var(--kopylov-fill-button-gap));
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--kopylov-fill-button-text) !important;
	cursor: pointer;
	font-family: "Inter Tight", "Inter", "Segoe UI", sans-serif;
	font-size: var(--kopylov-fill-button-font-size);
	font-style: normal;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1;
	text-decoration: none;
	text-transform: lowercase;
	white-space: nowrap;
	appearance: none;
	isolation: isolate;
	overflow: visible;
	transition: color 0.5s ease;
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link::before,
.wp-block-button:not(.is-style-outline) > .wp-block-button__link::after {
	position: absolute;
	inset-block: 0;
	border-radius: var(--kopylov-fill-button-radius);
	background: var(--kopylov-fill-button-bg);
	z-index: -1;
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link::before {
	content: "";
	inset-inline-start: 0;
	inset-inline-end: calc(var(--kopylov-fill-button-arrow-width) + var(--kopylov-fill-button-gap));
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link::after {
	content: var(--kopylov-arrow-symbol, "\2192");
	display: flex;
	align-items: center;
	justify-content: center;
	inset-inline-end: 0;
	width: var(--kopylov-fill-button-arrow-width);
	color: var(--kopylov-fill-button-text);
	font-family: "Inter Tight", "Inter", "Segoe UI", sans-serif;
	font-size: inherit;
	font-style: normal;
	font-weight: 400;
	line-height: 1;
	transition: color 0.5s ease;
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible {
	color: var(--kopylov-fill-button-hover-text) !important;
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover::after,
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible::after {
	color: var(--kopylov-fill-button-hover-text) !important;
}

.wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible {
	outline: 2px solid rgba(134, 39, 255, 0.22);
	outline-offset: 6px;
}

.wp-block-button:not(.is-style-outline).is-kopylov-arrow-hidden > .wp-block-button__link,
.is-kopylov-arrow-hidden .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	padding-inline-end: var(--kopylov-fill-button-inline);
}

.wp-block-button:not(.is-style-outline).is-kopylov-arrow-hidden > .wp-block-button__link::before,
.is-kopylov-arrow-hidden .wp-block-button:not(.is-style-outline) > .wp-block-button__link::before {
	inset-inline-end: 0;
}

.wp-block-button:not(.is-style-outline).is-kopylov-arrow-hidden > .wp-block-button__link::after,
.is-kopylov-arrow-hidden .wp-block-button:not(.is-style-outline) > .wp-block-button__link::after {
	content: none;
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	--kopylov-fill-button-arrow-width: var(--kopylov-arrow-inline-size, calc(1em + (var(--kopylov-fill-button-arrow-side) * 2)));
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: calc(1em + var(--kopylov-fill-button-block-start) + var(--kopylov-fill-button-block-end));
	padding-block-start: var(--kopylov-fill-button-block-start);
	padding-block-end: var(--kopylov-fill-button-block-end);
	padding-inline-start: var(--kopylov-fill-button-inline);
	padding-inline-end: calc(var(--kopylov-fill-button-inline) + var(--kopylov-fill-button-arrow-width) + var(--kopylov-fill-button-gap));
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--kopylov-outline-button-text) !important;
	cursor: pointer;
	font-family: "Inter Tight", "Inter", "Segoe UI", sans-serif;
	font-size: var(--kopylov-fill-button-font-size);
	font-style: normal;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1;
	text-decoration: none;
	text-transform: lowercase;
	white-space: nowrap;
	appearance: none;
	isolation: isolate;
	overflow: visible;
	transition: color 0.5s ease;
}

.wp-block-button.is-style-outline > .wp-block-button__link::before,
.wp-block-button.is-style-outline > .wp-block-button__link::after {
	position: absolute;
	inset-block: 0;
	border-radius: var(--kopylov-fill-button-radius);
	background: transparent;
	box-shadow: inset 0 0 0 var(--kopylov-outline-button-border-width) var(--kopylov-outline-button-border);
	box-sizing: border-box;
	z-index: -1;
	transition: box-shadow 0.5s ease, color 0.5s ease;
}

.wp-block-button.is-style-outline > .wp-block-button__link::before {
	content: "";
	inset-inline-start: 0;
	inset-inline-end: calc(var(--kopylov-fill-button-arrow-width) + var(--kopylov-fill-button-gap));
}

.wp-block-button.is-style-outline > .wp-block-button__link::after {
	content: var(--kopylov-arrow-symbol, "\2192");
	display: flex;
	align-items: center;
	justify-content: center;
	inset-inline-end: 0;
	width: var(--kopylov-fill-button-arrow-width);
	color: var(--kopylov-outline-button-text);
	font-family: "Inter Tight", "Inter", "Segoe UI", sans-serif;
	font-size: inherit;
	font-style: normal;
	font-weight: 400;
	line-height: 1;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible {
	color: var(--kopylov-outline-button-hover) !important;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover::before,
.wp-block-button.is-style-outline > .wp-block-button__link:hover::after,
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible::before,
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible::after {
	box-shadow: inset 0 0 0 var(--kopylov-outline-button-border-width) var(--kopylov-outline-button-hover);
	color: var(--kopylov-outline-button-hover);
}

.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible {
	outline: 2px solid rgba(134, 39, 255, 0.22);
	outline-offset: 6px;
}

.wp-block-button.is-style-outline.is-kopylov-arrow-hidden > .wp-block-button__link,
.is-kopylov-arrow-hidden .wp-block-button.is-style-outline > .wp-block-button__link {
	padding-inline-end: var(--kopylov-fill-button-inline);
}

.wp-block-button.is-style-outline.is-kopylov-arrow-hidden > .wp-block-button__link::before,
.is-kopylov-arrow-hidden .wp-block-button.is-style-outline > .wp-block-button__link::before {
	inset-inline-end: 0;
}

.wp-block-button.is-style-outline.is-kopylov-arrow-hidden > .wp-block-button__link::after,
.is-kopylov-arrow-hidden .wp-block-button.is-style-outline > .wp-block-button__link::after {
	content: none;
}

/* Preserve Spectra Responsive Conditions breakpoints for every block type. */
@media (min-width: 1025px) {
	body .uag-hide-desktop {
		display: none !important;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	body .uag-hide-tab {
		display: none !important;
	}
}

@media (max-width: 767px) {
	body .uag-hide-mob {
		display: none !important;
	}
}

@media (max-width: 1127px) {
	:root {
		--kopylov-fill-button-font-size: clamp(18px, 7vw, 28px);
		--kopylov-fill-button-block-start: 6px;
		--kopylov-fill-button-block-end: 10px;
		--kopylov-fill-button-arrow-side: clamp(14px, 4vw, 20px);
	}

	/* Keep WordPress navigation and block stacking on the same mobile range. */
	.wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
		display: flex !important;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open,
	.wp-block-navigation .wp-block-navigation__responsive-container.kopylov-is-closing {
		background-color: #000000 !important;
		z-index: 2147483646 !important;
	}

	body.kopylov-mobile-menu-active header.wp-block-template-part {
		z-index: 2147483647 !important;
		mix-blend-mode: normal !important;
		isolation: isolate;
	}

	body.kopylov-mobile-menu-active .kct-bg,
	body.kopylov-mobile-menu-active .kct-root,
	body.kopylov-mobile-menu-active #ultimate-cursor,
	body.kopylov-mobile-menu-active [id^="ultimate-cursor-"] {
		visibility: hidden !important;
	}

	.wp-block-navigation.kopylov-menu-open .wp-block-navigation__responsive-container-open {
		z-index: 2147483647 !important;
	}

	.wp-block-columns,
	.wp-block-columns.is-not-stacked-on-mobile {
		flex-wrap: wrap !important;
	}

	.wp-block-columns > .wp-block-column,
	.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column {
		flex-basis: 100% !important;
		max-width: 100%;
	}

	.is-layout-flex:not(.wp-block-navigation) {
		flex-wrap: wrap !important;
	}

	.alignfull.is-kopylov-full-width-padded {
		padding-left: var(--kopylov-full-width-padded-mobile) !important;
		padding-right: var(--kopylov-full-width-padded-mobile) !important;
	}

	/* Portfolio Last 5 keeps its own fluid title scale on mobile. */
	.portfolio-last-5-list .wp-block-post-title {
		font-size: clamp(56px, 14.9333333333vw, 148px) !important;
	}

	.hero-screen {
		min-height: calc(100vh - var(--kopylov-hero-flow-top-offset) - var(--wp-admin--admin-bar--height, 0px) - var(--kopylov-hero-bottom-gap));
		min-height: calc(100lvh - var(--kopylov-hero-flow-top-offset) - var(--wp-admin--admin-bar--height, 0px) - var(--kopylov-hero-bottom-gap));
		align-content: flex-end;
	}

	.full-screen-block {
		min-height: 100vh;
		min-height: 100lvh;
	}

	body.kopylov-header-fixed header.wp-block-template-part {
		top: 2rem;
	}

	:root {
		--kopylov-home-uxui-sticky-top: 90px;
		--kopylov-home-uxui-text-top: calc(90px + 40px);
		--kopylov-text-font-size: 1.25rem;
	}
}
