/**
 * Block style: Punkt (core/site-logo)
 *
 * Logo brightness switches by section (JS adds .logo-contrast-light / .logo-contrast-dark on header):
 * - Over wp-block-cover: white logo
 * - Over other blocks: black logo
 */

.wp-block-site-logo.is-style-punkt img {
	width: 94px;
	height: 23.38px;
	transition: filter 0.25s ease-in-out, transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;

	@media screen and (max-width: 900px) {
		width: auto;
		height: 21px;
	}
}

header.logo-contrast-light .wp-block-site-logo.is-style-punkt img {
	filter: brightness(0) invert(1);
}

header.logo-contrast-dark .wp-block-site-logo.is-style-punkt img {
	filter: brightness(0);
}

.custom-logo-link {
	text-decoration: none;
	display: flex !important;
	align-items: center;
	background-color: transparent;
	border: 0;
	position: relative;
	cursor: pointer;
	transition: all 250ms ease-in-out;
}

/* Prefix text before logo (e.g. on section #ompunkt, #hvordan) */
.wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix {
	font-family: var(--wp--preset--font-family--ekstra) !important;
	margin-inline-end: 2px;
	font-size: 30px;
	display: flex;
	align-items: center;
	gap: 3px;

	@media screen and (max-width: 900px) {
		gap: 3px;
		font-size: 20px;
	}
}

.wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-text {
	color: #625ff8;
	margin-bottom: 7px;

	@media screen and (max-width: 900px) {
		margin-bottom: 3px;
	}
}

.wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-text>span {
	display: inline-block;
	transition: opacity 0.1s ease-in-out;
}

/* Prefix text color changes based on logo contrast. */
header.logo-contrast-light .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-text {
	color: #625FF8;
	/* When logo is white. */
}

header.logo-contrast-dark .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-text {
	color: #3A34B7;
	/* When logo is black. */
}

.wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-bracket {
	display: inline-flex;
	align-items: center;
	position: relative;
	z-index: 10;
}

.wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-bracket svg {
	display: block;
	width: 8px;
	height: 21px;
	transition: transform 0.4s ease-in-out;
	transform-origin: left center;
	position: relative;
	z-index: 10;

	@media screen and (max-width: 900px) {
		width: auto;
		height: 20px;
	}
}

.wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix {
	position: relative;
	overflow: visible;
}

header.logo-contrast-light .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-bracket {
	color: #fff;
}

header.logo-contrast-dark .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-bracket {
	color: #000;
}

/* Single post pages: always white logo on desktop. */

body.single-post {
	header .wp-block-site-logo.is-style-punkt img {
		filter: brightness(0) invert(1) !important;
		/* White logo. */
	}

	header .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-bracket {
		color: #fff !important;
		/* White bracket. */
	}

	header.wp-block-template-part .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-text {
		color: #625FF8 !important;
	}

}

body.archive {
	header.wp-block-template-part.logo-contrast-dark-nav>.wp-block-group {
		background-color: rgba(255, 255, 255, 0.5) !important;
		backdrop-filter: opacity(1) blur(30px);
	}
}




/* Mobile: always white background, black logo (override scroll-based contrast). */
@media screen and (max-width: 900px) {
	header.wp-block-template-part .has-base-background-color {
		background-color: #000000 !important;
	}

	header.wp-block-template-part .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-text {
		color: #625FF8 !important;
	}

	header.wp-block-template-part .wp-block-site-logo.is-style-punkt img {
		filter: brightness(0) invert(1) !important;
		/* White logo. */
	}

	header.wp-block-template-part .wp-block-site-logo.is-style-punkt .wp-block-site-logo__prefix-bracket {
		color: #ffffff !important;
		/* Always white bracket. */
	}
}