/* Typewriter */
.skrivemaskine {
	max-width: 100%;
	overflow-wrap: anywhere;
}

.skrivemaskine-cursor {
	display: inline-block;
	margin-left: 0.05em;
	font: inherit;
	line-height: inherit;
	vertical-align: baseline;
	animation: skrivemaskineBlink 0.8s infinite;
}

@keyframes skrivemaskineBlink {
	0%, 50% {
		opacity: 1;
	}

	51%, 100% {
		opacity: 0;
	}
}

/* Marquee */
.marquee {
	--marquee-duration: 30s;
	--marquee-gap: 1.5em;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	overflow: hidden;
	white-space: nowrap;
}

.wp-block-column .marquee {
	width: 100%;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
}

.marquee .marquee-track {
	display: flex;
	align-items: center;
	width: max-content;
	min-width: 100%;
	gap: var(--marquee-gap);
	white-space: nowrap;
	will-change: transform;
	animation: marqueeScroll var(--marquee-duration) linear infinite;
}

.marquee .marquee-item {
	flex: 0 0 auto;
	white-space: nowrap;
}

@keyframes marqueeScroll {
	from {
		transform: translate3d(0, 0, 0);
	}

	to {
		transform: translate3d(calc(-50% - (var(--marquee-gap) / 2)), 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.marquee .marquee-track {
		animation: none;
		transform: none;
	}
}

/* Scroll text */
.scroll-text .char {
	opacity: 0.08;
	transition: opacity 0.18s linear;
}

@media (prefers-reduced-motion: reduce) {
	.scroll-text .char {
		opacity: 1;
		transition: none;
	}
}

/* Parallax */
.parallax-image.is-parallax-ready .wp-block-media-text__media {
	overflow: hidden;
	position: relative;
}

.parallax-image.is-parallax-ready .wp-block-media-text__media img {
	opacity: 0;
	visibility: hidden;
}

.parallax-image .parallax-image-bg {
	position: absolute;
	inset: -32% 0;
	z-index: 0;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transform: translate3d(0, 0, 0);
	will-change: transform;
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	.parallax-image .parallax-image-bg {
		inset: 0;
		transform: none;
	}
}


/* CSS Animationer */ 

@keyframes pulseAnimation {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

.pulse {
  animation-name: pulseAnimation;
  animation-duration: 2.3s;
  animation-timing-function: ease;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
}