/* Homepage-only decorative layer. No fixed positioning and no JavaScript. */
body.home {
	position: relative;
	background: #eaf8fd !important;
}

body.home .website-wrapper,
body.home .main-page-wrapper,
body.home #main-content,
body.home .site-content {
	background-color: transparent !important;
}

body.home .website-wrapper {
	position: relative;
	z-index: 1;
}

.anelok-home-decor {
	pointer-events: none;
	user-select: none;
}

.anelok-home-decor--page {
	position: absolute;
	inset: 0;
	z-index: 50;
	overflow: hidden;
}

.anelok-home-decor--top {
	position: absolute;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + 106px);
	left: 0;
	width: 100%;
	height: 54px;
	z-index: 391;
	overflow: hidden;
}

.anelok-decor__item,
.anelok-decor__line,
.anelok-decor__heart {
	--flip: 1;
	position: absolute;
	display: block;
	opacity: .84;
	transform-origin: 50% 55%;
	will-change: transform;
}

.anelok-decor__item {
	filter: drop-shadow(0 1px 1.5px rgba(22, 173, 211, .55));
}

.anelok-decor--mirror {
	--flip: -1;
}

.anelok-decor__line,
.anelok-decor__heart {
	fill: none;
	stroke: rgba(255, 255, 255, .98);
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
	filter: drop-shadow(0 1px 1px rgba(22, 173, 211, .5));
}

.anelok-decor__line path:first-child {
	stroke-dasharray: 5 8;
}

/* Header band: small, bright and clearly moving without touching navigation. */
.anelok-decor--top-bear {
	left: 4%;
	top: 1px;
	width: 42px;
	animation: anelok-float-a 7s ease-in-out infinite alternate;
}

.anelok-decor--top-cloud-one {
	left: 31%;
	top: 3px;
	width: 54px;
	animation: anelok-float-b 8.5s ease-in-out infinite alternate;
}

.anelok-decor--top-star {
	left: 52%;
	top: 5px;
	width: 27px;
	animation: anelok-float-c 6s ease-in-out infinite alternate;
}

.anelok-decor--top-cloud-two {
	right: 24%;
	top: 2px;
	width: 56px;
	animation: anelok-float-d 9s ease-in-out infinite alternate;
}

.anelok-decor--top-bunny {
	right: 4%;
	top: 0;
	width: 31px;
	animation: anelok-float-a 7.5s ease-in-out infinite alternate-reverse;
}

/* First screen and the start of the product area. */
.anelok-decor--cloud-01 { left: 1%; top: 350px; width: 62px; animation: anelok-float-b 8s ease-in-out infinite alternate; }
.anelok-decor--star-01 { right: 2%; top: 430px; width: 38px; animation: anelok-float-c 6.5s ease-in-out infinite alternate; }
.anelok-decor--bear-01 { left: 8%; top: 520px; width: 58px; animation: anelok-float-a 7s ease-in-out infinite alternate; }
.anelok-decor--giraffe-01 { right: 5%; top: 610px; width: 68px; animation: anelok-float-d 10s ease-in-out infinite alternate; }
.anelok-decor--elephant-01 { left: 2%; top: 800px; width: 76px; animation: anelok-float-b 8.5s ease-in-out infinite alternate; }
.anelok-decor--bunny-01 { right: 3%; top: 960px; width: 58px; animation: anelok-float-c 7s ease-in-out infinite alternate; }

/* Product grid: smaller repeated figures along both edges. */
.anelok-decor--cloud-02 { left: 3%; top: 1180px; width: 70px; animation: anelok-float-d 9s ease-in-out infinite alternate; }
.anelok-decor--star-02 { right: 5%; top: 1380px; width: 36px; animation: anelok-float-a 6.8s ease-in-out infinite alternate; }
.anelok-decor--giraffe-02 { left: 1%; top: 1560px; width: 58px; animation: anelok-float-b 8s ease-in-out infinite alternate; }
.anelok-decor--bear-02 { right: 2%; top: 1740px; width: 58px; animation: anelok-float-c 7.5s ease-in-out infinite alternate; }
.anelok-decor--elephant-02 { left: 4%; top: 1940px; width: 72px; animation: anelok-float-d 10s ease-in-out infinite alternate; }
.anelok-decor--bunny-02 { right: 5%; top: 2140px; width: 56px; animation: anelok-float-a 7s ease-in-out infinite alternate; }

/* SEO and information blocks. */
.anelok-decor--cloud-03 { left: 1%; top: 2390px; width: 72px; animation: anelok-float-b 8.5s ease-in-out infinite alternate; }
.anelok-decor--star-03 { right: 2%; top: 2600px; width: 40px; animation: anelok-float-c 6s ease-in-out infinite alternate; }
.anelok-decor--bear-03 { left: 4%; top: 2810px; width: 58px; animation: anelok-float-d 9.5s ease-in-out infinite alternate; }
.anelok-decor--giraffe-03 { right: 2%; top: 3050px; width: 66px; animation: anelok-float-a 7.5s ease-in-out infinite alternate; }
.anelok-decor--elephant-03 { left: 2%; top: 3310px; width: 72px; animation: anelok-float-b 8s ease-in-out infinite alternate; }
.anelok-decor--bunny-03 { right: 4%; top: 3560px; width: 56px; animation: anelok-float-c 6.8s ease-in-out infinite alternate; }

/* Lower homepage and footer. */
.anelok-decor--cloud-04 { left: 2%; top: 3870px; width: 72px; animation: anelok-float-d 9s ease-in-out infinite alternate; }
.anelok-decor--star-04 { right: 3%; top: 4140px; width: 38px; animation: anelok-float-a 7s ease-in-out infinite alternate; }
.anelok-decor--bear-04 { left: 4%; top: 4510px; width: 58px; animation: anelok-float-b 8s ease-in-out infinite alternate; }
.anelok-decor--cloud-05 { right: 2%; top: 4970px; width: 76px; animation: anelok-float-c 7.5s ease-in-out infinite alternate; }
.anelok-decor--footer-elephant { left: 2%; bottom: 145px; width: 62px; animation: anelok-float-a 7.2s ease-in-out infinite alternate; }
.anelok-decor--footer-cloud { left: 48%; bottom: 52px; width: 68px; animation: anelok-float-b 6.4s ease-in-out infinite alternate; }
.anelok-decor--footer-bunny { right: 3%; bottom: 118px; width: 54px; animation: anelok-float-c 7.8s ease-in-out infinite alternate; }

.anelok-decor--line-one { right: 1%; top: 740px; width: 112px; animation: anelok-float-line 8s ease-in-out infinite alternate; }
.anelok-decor--line-two { left: 1%; top: 1450px; width: 108px; --flip: -1; animation: anelok-float-line 9s ease-in-out infinite alternate; }
.anelok-decor--line-three { right: 1%; top: 2740px; width: 112px; animation: anelok-float-line 7.5s ease-in-out infinite alternate; }
.anelok-decor--line-four { left: 1%; top: 4230px; width: 108px; --flip: -1; animation: anelok-float-line 9.5s ease-in-out infinite alternate; }

.anelok-decor--heart-one { right: 4%; top: 1080px; width: 35px; animation: anelok-pulse 5.5s ease-in-out infinite alternate; }
.anelok-decor--heart-two { left: 4%; top: 2280px; width: 34px; animation: anelok-pulse 6.5s ease-in-out infinite alternate; }
.anelok-decor--heart-three { right: 4%; top: 3810px; width: 36px; animation: anelok-pulse 5.8s ease-in-out infinite alternate; }

@keyframes anelok-float-a {
	0% { transform: translate3d(0, 0, 0) rotate(-1.2deg) scaleX(var(--flip)); }
	100% { transform: translate3d(12px, -10px, 0) rotate(2.2deg) scaleX(var(--flip)); }
}

@keyframes anelok-float-b {
	0% { transform: translate3d(0, 0, 0) rotate(1deg) scaleX(var(--flip)); }
	100% { transform: translate3d(-11px, 9px, 0) rotate(-2deg) scaleX(var(--flip)); }
}

@keyframes anelok-float-c {
	0% { transform: translate3d(0, 0, 0) scale(1) scaleX(var(--flip)); }
	100% { transform: translate3d(9px, -8px, 0) scale(1.07) scaleX(var(--flip)); }
}

@keyframes anelok-float-d {
	0% { transform: translate3d(0, 0, 0) rotate(-.8deg) scaleX(var(--flip)); }
	100% { transform: translate3d(-8px, -12px, 0) rotate(1.8deg) scaleX(var(--flip)); }
}

@keyframes anelok-float-line {
	0% { transform: translate3d(0, 0, 0) scaleX(var(--flip)); }
	100% { transform: translate3d(12px, -9px, 0) scaleX(var(--flip)); }
}

@keyframes anelok-pulse {
	0% { transform: translate3d(0, 0, 0) scale(1); }
	100% { transform: translate3d(4px, -7px, 0) scale(1.14); }
}

@media (max-width: 1024px) {
	.anelok-home-decor--top {
		display: none;
	}

	.anelok-decor__item,
	.anelok-decor__line,
	.anelok-decor__heart {
		opacity: .76;
	}

	.anelok-decor--bear-01,
	.anelok-decor--bear-02,
	.anelok-decor--bear-03,
	.anelok-decor--bear-04 { width: 49px; }

	.anelok-decor--giraffe-01,
	.anelok-decor--giraffe-02,
	.anelok-decor--giraffe-03 { width: 52px; }

	.anelok-decor--elephant-01,
	.anelok-decor--elephant-02,
	.anelok-decor--elephant-03 { width: 60px; }

	.anelok-decor--bunny-01,
	.anelok-decor--bunny-02,
	.anelok-decor--bunny-03 { width: 47px; }

	.anelok-decor--footer-elephant { width: 54px; }
	.anelok-decor--footer-cloud { width: 58px; }
	.anelok-decor--footer-bunny { width: 47px; }

	.anelok-decor__line { width: 88px; }
}

@media (max-width: 767px) {
	body.home {
		background: #edf9fd !important;
	}

	.anelok-decor__item,
	.anelok-decor__heart {
		opacity: .68;
	}

	.anelok-decor__line,
	.anelok-decor--cloud-02,
	.anelok-decor--star-02,
	.anelok-decor--giraffe-02,
	.anelok-decor--bear-02,
	.anelok-decor--elephant-02,
	.anelok-decor--bunny-02,
	.anelok-decor--cloud-04,
	.anelok-decor--star-04,
	.anelok-decor--bear-04,
	.anelok-decor--heart-two {
		display: none;
	}

	.anelok-decor--cloud-01 { left: 2%; top: 300px; width: 44px; }
	.anelok-decor--star-01 { right: 3%; top: 430px; width: 27px; }
	.anelok-decor--bear-01 { left: 3%; top: 650px; width: 41px; }
	.anelok-decor--giraffe-01 { right: 3%; top: 890px; width: 38px; }
	.anelok-decor--elephant-01 { left: 3%; top: 1180px; width: 49px; }
	.anelok-decor--bunny-01 { right: 3%; top: 1480px; width: 38px; }
	.anelok-decor--cloud-03 { left: 3%; top: 1840px; width: 46px; }
	.anelok-decor--star-03 { right: 3%; top: 2210px; width: 27px; }
	.anelok-decor--bear-03 { left: 3%; top: 2630px; width: 40px; }
	.anelok-decor--giraffe-03 { right: 3%; top: 3100px; width: 38px; }
	.anelok-decor--elephant-03 { left: 3%; top: 3650px; width: 48px; }
	.anelok-decor--bunny-03 { right: 3%; top: 4220px; width: 38px; }
	.anelok-decor--cloud-05 { left: 3%; right: auto; top: 4800px; width: 46px; }
	.anelok-decor--footer-elephant { left: 2%; bottom: 150px; width: 42px; }
	.anelok-decor--footer-cloud { left: 43%; bottom: 38px; width: 45px; }
	.anelok-decor--footer-bunny { right: 2%; bottom: 120px; width: 38px; }
	.anelok-decor--heart-one { right: 5%; top: 1030px; width: 27px; }
	.anelok-decor--heart-three { right: 5%; top: 3900px; width: 28px; }
}

@media (prefers-reduced-motion: reduce) {
	.anelok-home-decor * {
		animation: none !important;
		will-change: auto;
	}
}
