/*
 * Styles theme.json cannot express. Loaded on the front end and in the editor.
 */

/* Header, main and footer sit flush. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* Sticky header; anchor targets stop below it. */
.site-header-wrapper {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: 100px;
}

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

.site-logo {
	margin: 0;
}

/* Block-level link: no inline line box below the image, so the logo centres on the menu. */
.site-logo a {
	display: block;
}

.site-logo img {
	display: block;
	height: 40px;
	width: auto;
}

/* Mobile menu overlay. */
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 80px;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open :is(.wp-block-navigation__responsive-container-content, .wp-block-navigation__container, .wp-block-navigation-item) {
	align-items: center;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	font-size: 22px;
}

/* Language dropdown (the "language-switcher" submenu), styled like the old WPML switcher. */
.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .language-switcher > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
}

.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .language-switcher .wp-block-navigation__submenu-container {
	min-width: 0 !important;
	border: 0;
}

.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .language-switcher .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 13px 20px;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: normal;
	white-space: nowrap;
}

.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .language-switcher .wp-block-navigation-item + .wp-block-navigation-item {
	border-top: 1px solid rgba(0, 0, 0, 0.19);
}

.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .language-switcher .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

/* Footer content is centred vertically in its 200px band. */
.site-footer {
	align-content: center;
}

.site-footer a {
	text-decoration: none;
}

/* Back-to-top button, fades in once the page is scrolled. */
.to-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 90;
	margin: 0 !important;
}

.to-top a {
	position: relative;
	display: block;
	width: 50px;
	height: 50px;
	background: var(--wp--preset--color--accent);
	font-size: 0;
}

.to-top a::before {
	content: "";
	position: absolute;
	top: 58%;
	left: 50%;
	width: 16px;
	height: 16px;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	transform: translate(-50%, -50%) rotate(45deg);
}

.to-top a:hover,
.to-top a:focus-visible {
	background: var(--wp--preset--color--contrast);
}

@supports (animation-timeline: scroll()) {
	.to-top {
		animation: kczmac-reveal linear both;
		animation-timeline: scroll(root);
		animation-range: 0 400px;
	}

	@keyframes kczmac-reveal {
		from {
			opacity: 0;
			visibility: hidden;
		}
		to {
			opacity: 1;
			visibility: visible;
		}
	}
}

.editor-styles-wrapper .to-top {
	position: static;
}

/* Entrance animations (see functions.php), timed like the old Elementor ones. */
.has-reveal :is(.fade-in, .zoom-in):not(.is-revealed) {
	opacity: 0;
}

.has-reveal .fade-in.is-revealed {
	animation: kczmac-fade-in 1.25s both;
}

.has-reveal .zoom-in.is-revealed {
	animation: kczmac-zoom-in 1.25s both;
}

@keyframes kczmac-fade-in {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes kczmac-zoom-in {
	from {
		opacity: 0;
		transform: scale3d(0.3, 0.3, 0.3);
	}
	50% {
		opacity: 1;
	}
}

@media print {
	.has-reveal :is(.fade-in, .zoom-in) {
		opacity: 1 !important;
		animation: none !important;
	}
}

/* Two-column rows that show the photo first on phones. */
@media (max-width: 781px) {
	.wp-block-columns.is-reversed-on-mobile {
		flex-direction: column-reverse;
	}
}

/* Service items: icon beside the text, smaller on phones. */
.service-item > .wp-block-image {
	flex-shrink: 0;
	margin: 0;
}

@media (max-width: 600px) {
	.service-item {
		flex-wrap: wrap !important;
	}

	.service-item > .wp-block-image img {
		width: 64px !important;
	}
}