/* Column backgrounds */
.bblce-bg-effect > .fl-col-content {
	isolation: isolate;
	overflow: hidden;
	position: relative;
}

.bblce-bg-effect > .fl-col-content::before,
.bblce-bg-effect > .fl-col-content::after {
	content: "";
	opacity: var(--bblce-opacity, .75);
	pointer-events: none;
	position: absolute;
	z-index: -1;
}

.bblce-bg-effect > .fl-col-content::before {
	animation-duration: var(--bblce-speed, 18s);
	animation-direction: var(--bblce-direction, normal);
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	background-color: var(--bblce-bg-3, #fff8e9);
	filter: blur(var(--bblce-blur, 0));
	height: var(--bblce-shape-height, 112%);
	left: var(--bblce-x, 50%);
	mix-blend-mode: var(--bblce-blend, normal);
	top: var(--bblce-y, 50%);
	transform: translate(-50%, -50%) rotate(var(--bblce-angle, 0deg));
	transform-origin: center;
	width: var(--bblce-shape-width, 112%);
}

.bblce-bg-effect > .fl-col-content::after {
	inset: 0;
}

.bblce-bg-effect > .fl-col-content > .fl-module,
.bblce-bg-effect > .fl-col-content > .fl-col-group {
	position: relative;
	z-index: 1;
}

.bblce-bg--pause-hover:hover > .fl-col-content::before {
	animation-play-state: paused;
}

.bblce-bg--sunburst > .fl-col-content::before {
	animation-name: bblce-spin;
	background: repeating-conic-gradient(from var(--bblce-angle, 0deg) at 50% 50%, var(--bblce-bg-1) 0deg 7deg, transparent 7deg 16deg);
}

.bblce-bg--sunburst > .fl-col-content::after {
	display: none;
}

.bblce-bg-shape--full > .fl-col-content::before { border-radius: 0; }
.bblce-bg-shape--circle > .fl-col-content::before { clip-path: circle(closest-side at 50% 50%); }
.bblce-bg-shape--ellipse > .fl-col-content::before { border-radius: 50%; }
.bblce-bg-shape--arch > .fl-col-content::before { border-radius: 50% 50% 12% 12% / 42% 42% 12% 12%; }
.bblce-bg-shape--organic > .fl-col-content::before { border-radius: 46% 54% 58% 42% / 51% 43% 57% 49%; }

.bblce-bg--aurora > .fl-col-content::before {
	animation-name: bblce-aurora;
	background:
		radial-gradient(ellipse at 15% 20%, var(--bblce-bg-1) 0 18%, transparent 49%),
		radial-gradient(ellipse at 84% 30%, var(--bblce-bg-2) 0 16%, transparent 45%),
		radial-gradient(ellipse at 54% 88%, var(--bblce-bg-1) 0 14%, transparent 48%);
	background-size: var(--bblce-scale-wide) var(--bblce-scale-wide);
	filter: blur(calc(var(--bblce-blur) + 18px));
}

.bblce-bg--bubbles > .fl-col-content::before {
	animation-name: bblce-float;
	background:
		radial-gradient(circle at 12% 78%, var(--bblce-bg-1) 0 5%, transparent 5.5%),
		radial-gradient(circle at 30% 20%, var(--bblce-bg-2) 0 9%, transparent 9.5%),
		radial-gradient(circle at 72% 64%, var(--bblce-bg-1) 0 12%, transparent 12.5%),
		radial-gradient(circle at 90% 14%, var(--bblce-bg-2) 0 6%, transparent 6.5%);
	background-size: var(--bblce-scale) var(--bblce-scale);
}

.bblce-bg--waves > .fl-col-content::before {
	animation-name: bblce-drift;
	background: repeating-radial-gradient(ellipse at var(--bblce-x) var(--bblce-y), transparent 0 18px, var(--bblce-bg-1) 19px 27px, transparent 28px 43px, var(--bblce-bg-2) 44px 49px);
	background-size: var(--bblce-scale) var(--bblce-scale);
}

.bblce-bg--dots > .fl-col-content::before {
	animation-name: bblce-slide;
	background-image: radial-gradient(circle, var(--bblce-bg-1) 0 18%, transparent 20%);
	background-size: var(--bblce-scale-small) var(--bblce-scale-small);
}

.bblce-bg--diagonal > .fl-col-content::before {
	animation-name: bblce-stripes;
	background: repeating-linear-gradient(calc(115deg + var(--bblce-angle)), var(--bblce-bg-1) 0 18px, transparent 18px 40px, var(--bblce-bg-2) 40px 53px, transparent 53px 75px);
	background-size: var(--bblce-scale-wide) var(--bblce-scale-wide);
}

.bblce-bg--mesh > .fl-col-content::before {
	animation-name: bblce-mesh;
	background:
		radial-gradient(at 18% 24%, var(--bblce-bg-1) 0 16%, transparent 42%),
		radial-gradient(at 82% 14%, var(--bblce-bg-2) 0 18%, transparent 45%),
		radial-gradient(at 72% 86%, var(--bblce-bg-1) 0 14%, transparent 40%),
		radial-gradient(at 20% 78%, var(--bblce-bg-2) 0 20%, transparent 46%);
	filter: blur(calc(var(--bblce-blur) + 28px));
}

.bblce-bg--confetti > .fl-col-content::before {
	animation-name: bblce-confetti;
	background-image:
		linear-gradient(35deg, var(--bblce-bg-1) 12%, transparent 13%),
		linear-gradient(145deg, var(--bblce-bg-2) 12%, transparent 13%),
		linear-gradient(70deg, transparent 82%, var(--bblce-bg-1) 83% 91%, transparent 92%);
	background-position: 0 0, 38px 52px, 78px 18px;
	background-size: var(--bblce-scale-medium) var(--bblce-scale-medium);
}

/* Photo and video frames */
.bblce-frame {
	--bblce-frame-radius: 48% 48% 12% 12% / 34% 34% 9% 9%;
}

.bblce-frame--editorial { --bblce-frame-radius: 42% 42% 8% 18% / 24% 24% 8% 12%; }
.bblce-frame--organic { --bblce-frame-radius: 48% 52% 46% 54% / 44% 42% 58% 56%; }
.bblce-frame--capsule { --bblce-frame-radius: 999px; }
.bblce-frame--soft { --bblce-frame-radius: 34px 34px 16px 16px; }

.bblce-frame .fl-photo-content,
.bblce-frame .fl-video {
	background-color: var(--bblce-frame-bg, #fff);
	border-color: var(--bblce-frame-border-color, #fff);
	border-style: solid;
	border-width: var(--bblce-frame-border-width, 0);
	border-radius: var(--bblce-frame-radius);
	box-shadow: var(--bblce-shadow-x, 8px) var(--bblce-shadow-y, 14px) var(--bblce-shadow-blur, 28px) var(--bblce-shadow-spread, -8px) var(--bblce-shadow-color, rgba(23, 49, 45, .22));
	box-sizing: border-box;
	overflow: hidden;
	padding: var(--bblce-frame-padding, 12px);
	transform: rotate(var(--bblce-frame-rotation, -2deg));
	transform-origin: center;
	transition: transform var(--bblce-hover-speed, 350ms) cubic-bezier(.2, .75, .2, 1), box-shadow var(--bblce-hover-speed, 350ms) ease;
}

.bblce-frame .fl-photo-img,
.bblce-frame .fl-video video,
.bblce-frame .fl-video iframe,
.bblce-frame .wp-video,
.bblce-frame .mejs-container {
	border-radius: inherit;
}

.bblce-frame .fl-photo-content,
.bblce-frame .fl-video,
.bblce-frame .wp-video {
	overflow: hidden;
}

.bblce-frame .fl-photo-img {
	display: block;
	width: 100%;
}

.bblce-frame--hover:hover .fl-photo-content,
.bblce-frame--hover:hover .fl-video {
	transform: rotate(0deg) translateY(-4px);
}

@keyframes bblce-spin {
	to { transform: translate(-50%, -50%) rotate(calc(var(--bblce-angle) + 360deg)) scale(1.03); }
}

@keyframes bblce-aurora {
	0%, 100% { transform: translate(-53%, -52%) rotate(var(--bblce-angle)) scale(1); }
	50% { transform: translate(-46%, -47%) rotate(calc(var(--bblce-angle) + 12deg)) scale(1.12); }
}

@keyframes bblce-float {
	0%, 100% { transform: translate(-50%, -47%) rotate(var(--bblce-angle)); }
	50% { transform: translate(-47%, -55%) rotate(calc(var(--bblce-angle) + 8deg)); }
}

@keyframes bblce-drift {
	from { background-position: 0 0; }
	to { background-position: 180px 90px; }
}

@keyframes bblce-slide {
	from { background-position: 0 0; }
	to { background-position: 100px 100px; }
}

@keyframes bblce-stripes {
	from { background-position: 0 0; }
	to { background-position: 220px 0; }
}

@keyframes bblce-mesh {
	0%, 100% { transform: translate(-52%, -50%) rotate(var(--bblce-angle)) scale(1.02); }
	33% { transform: translate(-47%, -53%) rotate(calc(var(--bblce-angle) + 5deg)) scale(1.1); }
	66% { transform: translate(-50%, -46%) rotate(calc(var(--bblce-angle) - 5deg)) scale(1.04); }
}

@keyframes bblce-confetti {
	from { background-position: 0 0, 38px 52px, 78px 18px; }
	to { background-position: 110px 180px, 148px 232px, 188px 198px; }
}

@media (prefers-reduced-motion: reduce) {
	.bblce-bg-effect > .fl-col-content::before {
		animation: none !important;
	}

	.bblce-frame .fl-photo-content,
	.bblce-frame .fl-video {
		transition: none;
	}
}