/* =================================================================
   File: inc/elementor/widgets/banner/style.css
   ================================================================= */
.liqui-banner {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius-xl);
	display: flex;
	color: #fff;
	isolation: isolate;
}
.liqui-banner--fullbleed {
	width: 100vw;
	margin-inline-start: calc(50% - 50vw);
	margin-inline-end:   calc(50% - 50vw);
	border-radius: 0;
}
.liqui-banner__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	z-index: 1;
}
.liqui-banner__overlay { position: absolute; inset: 0; z-index: 2; }

.liqui-banner__inner {
	position: relative;
	z-index: 3;
	width: 100%;
	max-width: 1600px;
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 64px);
	padding-block: clamp(40px, 6vw, 96px);
	display: flex;
}
.liqui-banner--align-start .liqui-banner__inner  { justify-content: flex-start; }
.liqui-banner--align-center .liqui-banner__inner { justify-content: center; text-align: center; }
.liqui-banner--align-end .liqui-banner__inner    { justify-content: flex-end; text-align: end; }

.liqui-banner__copy {
	max-width: 640px;
	padding: clamp(20px, 3vw, 36px);
	border-radius: var(--radius-xl);
	background: rgba(255,255,255, 0.20);
	border: 1px solid rgba(255,255,255, 0.25);
	-webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
	backdrop-filter:         blur(var(--glass-blur)) saturate(140%);
	box-shadow: 0 24px 60px -20px rgba(0,0,0,0.45), inset 1px 1px 0 rgba(255,255,255,0.20);
}
.liqui-banner__eyebrow { color: #fff; opacity: 0.9; margin-bottom: var(--space-2); }
.liqui-banner__title   { color: #fff; margin: 0 0 var(--space-2); line-height: 1.1; }
.liqui-banner__text    { color: rgba(255,255,255,0.92); margin: 0 0 var(--space-4); }
.liqui-banner__ctas    { gap: var(--space-2); }
.liqui-banner--align-center .liqui-banner__copy { margin-inline: auto; }
.liqui-banner--align-center .liqui-banner__ctas { justify-content: center; }
.liqui-banner--align-end .liqui-banner__copy { margin-inline-start: auto; }
.liqui-banner--align-end .liqui-banner__ctas { justify-content: flex-end; }
