/* ===================================================
   HERO SECTION
=================================================== */

.ulg-hero-section{
	position:relative;
	padding:
	110px 0 120px;

	overflow:hidden;
	isolation:isolate;
}

.ulg-hero-section::before{
	content:"";
	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at top right,
		rgba(0,209,255,.08),
		transparent 55%
	);

	pointer-events:none;
	z-index:0;
}

.ulg-hero-glow{
	position:absolute;
	top:-180px;
	right:-180px;

	width:700px;
	height:700px;

	border-radius:50%;

	background:
	radial-gradient(
		circle,
		rgba(0,209,255,.18),
		transparent 70%
	);

	filter:
	blur(60px);

	z-index:0;
	pointer-events:none;
}

/* ===================================================
   HERO GRID
=================================================== */

.ulg-hero-grid{
	display:grid;

	grid-template-columns:
		minmax(0,1.1fr)
		minmax(320px,.9fr);

	align-items:center;
	gap:60px;

	position:relative;
	z-index:2;
}

/* ===================================================
   HERO CONTENT
=================================================== */

.ulg-hero-content{
	max-width:720px;
	min-width:0;
}

.ulg-hero-title{
	margin-bottom:24px;
	max-width:760px;
	line-height:1.1;
}

.ulg-hero-subtitle{
	font-size:20px;
	line-height:1.9;
	max-width:640px;

	margin-bottom:36px;

	color:
	rgba(
		255,
		255,
		255,
		.78
	);
}

.ulg-hero-actions{
	display:flex;
	flex-wrap:wrap;
	gap:18px;
	margin-bottom:42px;
}

/* ===================================================
   HERO TRUST
=================================================== */

.ulg-hero-trust{
	display:flex;
	flex-wrap:wrap;
	gap:16px;
}

.ulg-trust-item{
	display:flex;
	align-items:center;
	gap:10px;

	padding:
	14px 20px;

	border-radius:
	999px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	var(--ulg-border);

	backdrop-filter:
	blur(18px);

	-webkit-backdrop-filter:
	blur(18px);

	font-size:15px;
	font-weight:600;
	color:#fff;
}

/* ===================================================
   HERO VISUAL
=================================================== */

.ulg-hero-visual{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	min-width:0;
}

.ulg-hero-genie{
	position:relative;
	width:100%;
	max-width:560px;

	display:flex;
	align-items:center;
	justify-content:center;
}


.ulg-genie-image{

	width:100%;
	max-width:700px;
	height:auto;

	position:relative;
	z-index:5;

	filter:
	drop-shadow(
		0 30px 80px
		rgba(
			0,
			209,
			255,
			0.25
		)
	);

	animation:
	ulgFloat 5s
	ease-in-out infinite;
}


/* ===================================================
   SPEECH BOX
=================================================== */

.ulg-genie-speech-box{
	position:absolute;

	top:20px;
	left:-40px;

	max-width:320px;
	z-index:8;

	padding:
	22px 26px;

	border-radius:
	26px;

	background:
	rgba(
		255,
		255,
		255,
		.08
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.10
	);

	backdrop-filter:
	blur(24px);

	-webkit-backdrop-filter:
	blur(24px);

	box-shadow:
	0 25px 50px
	rgba(0,0,0,.22);
}

#ulg-genie-speech{
	font-size:16px;
	font-weight:600;
	line-height:1.7;
	color:#fff;
}

/* ===================================================
   PARTICLES
=================================================== */

.ulg-particle{
	position:absolute;
	border-radius:50%;
	filter:blur(4px);
	z-index:2;

	animation:
	floatParticle
	6s ease-in-out
	infinite;

	will-change:
	transform;
}

.p1{
	top:8%;
	left:10%;

	width:18px;
	height:18px;

	background:
	var(--ulg-primary);
}

.p2{
	top:22%;
	right:8%;

	width:12px;
	height:12px;

	background:
	var(--ulg-gold);
}

.p3{
	bottom:18%;
	left:6%;

	width:24px;
	height:24px;

	background:
	rgba(
		123,
		97,
		255,
		.8
	);
}

.p4{
	right:10%;
	bottom:12%;

	width:14px;
	height:14px;

	background:
	rgba(
		255,
		255,
		255,
		.7
	);
}

/* ===================================================
   VALUE SECTION
=================================================== */

.ulg-value-section{
	padding-top:20px;
}

.ulg-value-grid{
	display:grid;

	grid-template-columns:
		repeat(
			3,
			minmax(0,1fr)
		);

	gap:28px;
	align-items:stretch;
}

/* ===================================================
   VALUE CARD
=================================================== */

.ulg-value-card{
	position:relative;

	display:flex;
	flex-direction:column;
	height:100%;

	padding:
	42px 34px;

	border-radius:
	34px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	backdrop-filter:
	blur(18px);

	-webkit-backdrop-filter:
	blur(18px);

	overflow:hidden;

	transition:
	var(--ulg-transition);
}

.ulg-value-card:hover{
	transform:
	translateY(-10px);

	border-color:
	rgba(
		0,
		209,
		255,
		.25
	);

	box-shadow:
	0 30px 60px
	rgba(0,0,0,.25);
}

.ulg-value-card::before{
	content:"";
	position:absolute;

	top:0;
	left:0;

	width:100%;
	height:5px;

	background:
	linear-gradient(
		90deg,
		var(--ulg-primary),
		var(--ulg-secondary)
	);
}

.ulg-value-icon{
	width:78px;
	height:78px;

	display:flex;
	align-items:center;
	justify-content:center;

	border-radius:
	22px;

	font-size:34px;

	margin-bottom:28px;

	background:
	rgba(
		255,
		255,
		255,
		.08
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.10
	);

	flex-shrink:0;
}

.ulg-value-card h3{
	font-size:28px;
	margin-bottom:18px;
}

.ulg-value-card p{
	margin-bottom:0;
}

/* ===================================================
   SERVICES SECTION
=================================================== */

.ulg-services-section{
	position:relative;
}

.ulg-services-grid{
	display:grid;

	grid-template-columns:
		repeat(
			3,
			minmax(0,1fr)
		);

	gap:28px;
	align-items:stretch;
}

.ulg-service-card{
	position:relative;

	display:flex;
	flex-direction:column;
	height:100%;

	padding:
	38px 32px;

	border-radius:
	34px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	backdrop-filter:
	blur(20px);

	-webkit-backdrop-filter:
	blur(20px);

	overflow:hidden;

	transition:
	var(--ulg-transition);
}

.ulg-service-card:hover{
	transform:
	translateY(-12px);

	border-color:
	rgba(
		0,
		209,
		255,
		.26
	);

	box-shadow:
	0 35px 70px
	rgba(0,0,0,.28);
}

.ulg-service-card::before{
	content:"";
	position:absolute;

	top:0;
	left:0;

	width:100%;
	height:5px;

	background:
	linear-gradient(
		90deg,
		var(--ulg-primary),
		var(--ulg-secondary)
	);

	transform:
	scaleX(0);

	transform-origin:left;

	transition:
	transform .4s ease;
}

.ulg-service-card:hover::before{
	transform:
	scaleX(1);
}

.ulg-service-icon{
	width:78px;
	height:78px;

	display:flex;
	align-items:center;
	justify-content:center;

	font-size:34px;

	border-radius:
	24px;

	margin-bottom:26px;

	background:
	rgba(
		255,
		255,
		255,
		.07
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	flex-shrink:0;
}

.ulg-service-card h3{
	font-size:28px;
	margin-bottom:16px;
}

.ulg-service-card p{
	margin-bottom:0;
	flex-grow:1;
}

.ulg-services-cta{
	text-align:center;
	margin-top:50px;
}

/* ===================================================
   PROCESS SECTION
=================================================== */

.ulg-process-grid{
	display:grid;

	grid-template-columns:
		repeat(
			4,
			minmax(0,1fr)
		);

	gap:26px;
}

.ulg-process-card{
	position:relative;

	padding:
	42px 28px;

	border-radius:
	32px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	text-align:center;

	transition:
	var(--ulg-transition);

	height:100%;
}

.ulg-process-card:hover{
	transform:
	translateY(-10px);

	box-shadow:
	0 25px 60px
	rgba(0,0,0,.28);
}

.ulg-process-number{
	width:82px;
	height:82px;

	display:flex;
	align-items:center;
	justify-content:center;

	margin:
	0 auto 26px;

	border-radius:50%;

	font-size:28px;
	font-weight:800;

	background:
	linear-gradient(
		135deg,
		var(--ulg-primary),
		var(--ulg-secondary)
	);

	color:#fff;
}

.ulg-process-card h3{
	font-size:26px;
	margin-bottom:16px;
}

.ulg-process-cta{
	text-align:center;
	margin-top:52px;
}

/* ===================================================
   WHY US SECTION
=================================================== */

.ulg-why-grid{
	display:grid;

	grid-template-columns:
		minmax(0,1fr)
		minmax(0,1fr);

	gap:60px;
	align-items:center;
}

.ulg-why-list{
	margin-top:36px;

	display:flex;
	flex-direction:column;
	gap:24px;
}

.ulg-why-item{
	display:flex;
	gap:18px;
	align-items:flex-start;
}

.ulg-check{
	width:52px;
	height:52px;

	display:flex;
	align-items:center;
	justify-content:center;

	flex-shrink:0;

	border-radius:50%;

	font-size:22px;
	font-weight:800;

	background:
	linear-gradient(
		135deg,
		var(--ulg-primary),
		var(--ulg-secondary)
	);

	color:#fff;
}

.ulg-why-item h4{
	font-size:22px;
	margin-bottom:10px;
}

/* ===================================================
   WHY STATS
=================================================== */

.ulg-why-stats{
	display:grid;

	grid-template-columns:
		repeat(
			2,
			minmax(0,1fr)
		);

	gap:24px;
}

.ulg-stat-card{
	padding:
	38px 28px;

	border-radius:
	30px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	backdrop-filter:
	blur(20px);

	text-align:center;

	transition:
	var(--ulg-transition);
}

.ulg-stat-card:hover{
	transform:
	translateY(-8px);
}

.ulg-stat-card h3{
	font-size:46px;

	margin-bottom:10px;

	background:
	linear-gradient(
		135deg,
		var(--ulg-primary),
		var(--ulg-gold)
	);

	-webkit-background-clip:
	text;

	-webkit-text-fill-color:
	transparent;
}

/* ===================================================
   AUDIT SECTION
=================================================== */

.ulg-audit-wrapper{
	display:grid;

	grid-template-columns:
		minmax(0,1fr)
		minmax(0,1fr);

	gap:60px;
	align-items:center;
}

.ulg-audit-benefits{
	margin-top:36px;

	display:grid;

	grid-template-columns:
		repeat(
			2,
			minmax(0,1fr)
		);

	gap:18px;
}

.ulg-audit-item{
	padding:
	16px 20px;

	border-radius:
	18px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	font-weight:600;
}

.ulg-audit-form-wrap{
	padding:42px;

	border-radius:
	38px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	backdrop-filter:
	blur(22px);

	box-shadow:
	0 25px 60px
	rgba(0,0,0,.24);
}

/* ===================================================
   FORM
=================================================== */

.ulg-form-step{
	display:none;
}

.ulg-form-step.active{
	display:block;
}

.ulg-form-step h3{
	font-size:30px;
	margin-bottom:28px;
}

.ulg-audit-form input,
.ulg-audit-form select,
.ulg-audit-form textarea{
	width:100%;
	min-height:62px;

	padding:
	18px 22px;

	margin-bottom:18px;

	border-radius:
	18px;

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.10
	);

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	color:#fff;
	font-size:16px;

	outline:none;

	backdrop-filter:
	blur(12px);

	-webkit-backdrop-filter:
	blur(12px);

	transition:
	var(--ulg-transition);
}

.ulg-audit-form textarea{
	min-height:140px;
	resize:vertical;
}

.ulg-audit-form input:focus,
.ulg-audit-form select:focus,
.ulg-audit-form textarea:focus{
	border-color:
	var(--ulg-primary);

	box-shadow:
	0 0 0 4px
	rgba(
		0,
		209,
		255,
		.08
	);
}

.ulg-audit-form input::placeholder,
.ulg-audit-form textarea::placeholder{
	color:
	rgba(
		255,
		255,
		255,
		.55
	);
}

.ulg-next-step{
	margin-top:8px;
}

/* ===================================================
   CASE STUDIES
=================================================== */

.ulg-case-grid{
	display:grid;

	grid-template-columns:
		repeat(
			3,
			minmax(0,1fr)
		);

	gap:28px;
}

.ulg-case-card{
	position:relative;

	padding:
	38px 34px;

	border-radius:
	34px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	backdrop-filter:
	blur(20px);

	-webkit-backdrop-filter:
	blur(20px);

	overflow:hidden;

	transition:
	var(--ulg-transition);

	height:100%;
}

.ulg-case-card:hover{
	transform:
	translateY(-12px);

	border-color:
	rgba(
		0,
		209,
		255,
		.22
	);

	box-shadow:
	0 30px 70px
	rgba(0,0,0,.28);
}

.ulg-case-card::before{
	content:"";
	position:absolute;
	top:0;
	left:0;

	width:100%;
	height:5px;

	background:
	linear-gradient(
		90deg,
		var(--ulg-primary),
		var(--ulg-secondary)
	);
}

.ulg-case-badge{
	display:inline-flex;
	align-items:center;

	padding:
	10px 18px;

	border-radius:
	999px;

	background:
	rgba(
		255,
		255,
		255,
		.08
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.10
	);

	font-size:14px;
	font-weight:700;

	margin-bottom:24px;
}

.ulg-case-card h3{
	font-size:34px;
	margin-bottom:16px;
}

.ulg-case-metrics{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-top:24px;
}

.ulg-case-metrics span{
	padding:
	10px 16px;

	border-radius:
	999px;

	background:
	rgba(
		255,
		255,
		255,
		.06
	);

	font-size:14px;
	font-weight:600;
}

.ulg-case-cta{
	text-align:center;
	margin-top:50px;
}

/* ===================================================
   FAQ
=================================================== */

.ulg-faq-wrap{
	max-width:900px;
	margin:0 auto;
}

.ulg-faq-item{
	margin-bottom:18px;

	border-radius:
	28px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	overflow:hidden;
}

.ulg-faq-question{
	width:100%;

	display:flex;
	align-items:center;
	justify-content:space-between;

	padding:
	28px 32px;

	background:none;
	border:none;

	cursor:pointer;
	text-align:left;

	color:#fff;

	font-size:20px;
	font-weight:700;
}

.ulg-faq-icon{
	font-size:30px;
	transition:
	transform .3s ease;
}

.ulg-faq-item.active
.ulg-faq-icon{
	transform:
	rotate(45deg);
}

.ulg-faq-answer{
	display:none;
	padding:
	0 32px 28px;
}

.ulg-faq-item.active
.ulg-faq-answer{
	display:block;
}

/* ===================================================
   FINAL CTA
=================================================== */

.ulg-final-cta-section{
	padding-bottom:120px;
}

.ulg-final-cta-box{
	position:relative;

	display:grid;

	grid-template-columns:
		minmax(0,1fr)
		minmax(280px,.9fr);

	align-items:center;

	gap:50px;

	padding:70px;

	border-radius:
	44px;

	background:
	rgba(
		255,
		255,
		255,
		.05
	);

	border:
	1px solid
	rgba(
		255,
		255,
		255,
		.08
	);

	backdrop-filter:
	blur(24px);

	overflow:hidden;
}

.ulg-final-actions{
	display:flex;
	flex-wrap:wrap;
	gap:18px;
	margin-top:34px;
}

.ulg-final-genie{
	max-width:430px;
	width:100%;

	filter:
	drop-shadow(
		0 35px 60px
		rgba(0,0,0,.32)
	);

	animation:
	ulgFloat 5s
	ease-in-out infinite;
}

/* ===================================================
   GENIE WIDGET
=================================================== */

.ulg-genie-widget{
	position:fixed;
	right:26px;
	bottom:26px;
	z-index:9999;
}

.ulg-genie-box{
	position:absolute;
	right:0;
	bottom:105px;

	width:360px;
	max-width:
	calc(100vw - 30px);
}

/* ===================================================
   ACCESSIBILITY
=================================================== */

@media (prefers-reduced-motion: reduce){

	*{
		animation:none !important;
		transition:none !important;
		scroll-behavior:auto !important;
	}
}

/* ===================================================
   TABLET
=================================================== */

@media(max-width:1100px){

	.ulg-services-grid,
	.ulg-case-grid{
		grid-template-columns:
		1fr 1fr;
	}

	.ulg-process-grid{
		grid-template-columns:
		1fr 1fr;
	}

	.ulg-why-grid,
	.ulg-audit-wrapper,
	.ulg-final-cta-box{
		grid-template-columns:
		1fr;
	}

.ulg-hero-grid{

	display:grid;

	grid-template-columns:
		1fr 1fr;

	align-items:center;

	gap:80px;

	position:relative;

	z-index:2;
}

	.ulg-hero-actions,
	.ulg-hero-trust{
		justify-content:center;
	}

	.ulg-genie-speech-box{
		left:0;
		right:0;
		top:-20px;
		margin:auto;
	}
}

/* ===================================================
   MOBILE
=================================================== */

@media(max-width:768px){

	.ulg-hero-section{
		padding:
		50px 0 80px;
	}

.ulg-hero-title{

	font-size:
	clamp(
		54px,
		6vw,
		82px
	);

	line-height:1.05;

	margin-bottom:24px;

	max-width:760px;
}

.ulg-hero-subtitle{

	font-size:22px;

	line-height:1.8;

	max-width:650px;

	margin-bottom:40px;

	color:
	rgba(
		255,
		255,
		255,
		0.82
	);
}

	.ulg-services-grid,
	.ulg-process-grid,
	.ulg-case-grid,
	.ulg-value-grid,
	.ulg-why-stats,
	.ulg-audit-benefits{
		grid-template-columns:
		1fr;
	}

	.ulg-genie-speech-box{
		position:relative;
		top:0;
		left:0;

		max-width:100%;
		margin-bottom:20px;
	}

	.ulg-audit-form-wrap,
	.ulg-final-cta-box{
		padding:
		30px 24px;
	}

	.ulg-faq-question{
		font-size:18px;

		padding:
		24px 22px;
	}

	.ulg-faq-answer{
		padding:
		0 22px 22px;
	}

	.ulg-genie-widget{
		right:18px;
		bottom:18px;
	}

	.ulg-genie-box{
		width:calc(100vw - 24px);
		right:-6px;
	}

	.ulg-final-genie{
		max-width:280px;
	}
}

/* ===================================================
   ELEMENTOR FIX
=================================================== */

.elementor-section
.ulg-hero-section,
.elementor-section
.ulg-services-section{
	margin:0;
}