:root {
	--gr-red: #FF0000;
	--gr-blue: #1E38FF;
	--gr-green: #009612;
	--gr-dark: #1a1a2e;
}

body {
	color: var(--gr-dark);
	background-color: #fbfbfd;
	background-image:
		radial-gradient(900px circle at 10% 0%, rgba(30,56,255,.07), transparent 55%),
		radial-gradient(900px circle at 90% 35%, rgba(0,150,18,.07), transparent 55%),
		radial-gradient(900px circle at 15% 90%, rgba(255,0,0,.05), transparent 55%),
		radial-gradient(rgba(26,26,46,.06) 1px, transparent 1px);
	background-repeat: no-repeat, no-repeat, no-repeat, repeat;
	background-attachment: fixed, fixed, fixed, local;
	background-size: 100% 100%, 100% 100%, 100% 100%, 24px 24px;
}

/* Alternate section background (replaces bg-light) */
.gr-section-alt {
	background-color: rgba(242,244,249,.6);
}

/* Shared icon tiles */
.gr-card-icon {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	font-size: 1.4rem;
	color: #fff;
}
.gr-card-icon-blue { background: linear-gradient(135deg, var(--gr-blue), #4d63ff); }
.gr-card-icon-green { background: linear-gradient(135deg, var(--gr-green), #35c94f); }
.gr-card-icon-red { background: linear-gradient(135deg, var(--gr-red), #ff5c5c); }

/* Feature cards (icon + title + description + link) */
.gr-feature-card {
	display: block;
	text-decoration: none;
	color: var(--gr-dark);
	background: rgba(255,255,255,.55);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-radius: 18px;
	border: 1px solid rgba(255,255,255,.6);
	padding: 2rem;
	height: 100%;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}
.gr-feature-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 1.25rem 2.5rem rgba(26,26,46,.14);
	color: var(--gr-dark);
	background: rgba(255,255,255,.7);
}
.gr-feature-card-blue:hover { border-color: rgba(30,56,255,.4); }
.gr-feature-card-green:hover { border-color: rgba(0,150,18,.4); }
.gr-feature-link {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-weight: 700;
	font-size: .9rem;
}
.gr-feature-card-blue .gr-feature-link { color: var(--gr-blue); }
.gr-feature-card-green .gr-feature-link { color: var(--gr-green); }
.gr-feature-card:hover .gr-feature-link i { transform: translateX(3px); }
.gr-feature-link i { transition: transform .2s ease; }

/* Small stat / trust cards */
.gr-trust-card {
	background: rgba(255,255,255,.55);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid rgba(255,255,255,.6);
	border-radius: 16px;
	padding: 1.75rem 1rem;
	box-shadow: 0 .5rem 1.5rem rgba(26,26,46,.08);
	height: 100%;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.gr-trust-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 .85rem 2rem rgba(26,26,46,.14);
	background: rgba(255,255,255,.7);
}
.gr-badge-row-icon {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto .85rem auto;
	font-size: 1.3rem;
	color: #fff;
}

/* Contact / info card */
.gr-contact-card {
	background: rgba(255,255,255,.55);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-radius: 18px;
	border: 1px solid rgba(255,255,255,.6);
	box-shadow: 0 .5rem 2rem rgba(26,26,46,.1);
	padding: 2.25rem;
}
.gr-contact-icon {
	width: 46px;
	height: 46px;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(244,245,247,.8);
	flex: 0 0 auto;
}

/* Floating preview cards (hero visual) */
.gr-float-card {
	position: absolute;
	display: flex;
	align-items: center;
	gap: .85rem;
	background: rgba(255,255,255,.6);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid rgba(255,255,255,.65);
	border-radius: 16px;
	box-shadow: 0 1rem 2.5rem rgba(26,26,46,.16);
	padding: 1rem 1.25rem;
	max-width: 250px;
}

/* Pill buttons with lift-on-hover */
.gr-btn-pill {
	border-radius: 50px !important;
	padding: .65rem 1.6rem !important;
	font-weight: 600;
	transition: transform .15s ease, box-shadow .15s ease;
}
.gr-btn-pill:hover {
	transform: translateY(-2px);
	box-shadow: 0 .6rem 1.4rem rgba(26,26,46,.15);
}

/* Simple entrance animation, used on hero content */
@keyframes grFadeInUp {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: translateY(0); }
}
.gr-animate-in {
	animation: grFadeInUp .6s ease both;
}
.gr-animate-in.gr-delay-1 { animation-delay: .1s; }
.gr-animate-in.gr-delay-2 { animation-delay: .2s; }
.gr-animate-in.gr-delay-3 { animation-delay: .3s; }