:where([class^="ri-"])::before { content: "\f3c2"; }
body {
	font-family: 'Roboto', sans-serif;
	background-color: #1A1A1A;
	color: #E0E0E0;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Inter', sans-serif;
}
.gradient-text {
	background: linear-gradient(90deg, #00E5FF, #2979FF);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.nav-link {
	position: relative;
}
.nav-link::after {
	content: '';
	position: absolute;
	width: 0;
	height: 2px;
	bottom: -4px;
	left: 0;
	background: linear-gradient(90deg, #00E5FF, #2979FF);
	transition: width 0.3s ease;
}
.nav-link:hover::after {
	width: 100%;
}
.service-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	background: linear-gradient(145deg, #222222, #2D2D2D);
}
.service-card:hover {
	transform: translateY(-10px);
	box-shadow: 0 15px 30px rgba(0, 229, 255, 0.1);
}
.icon-container {
	background: linear-gradient(145deg, #2D2D2D, #222222);
}
.cta-button {
	background: linear-gradient(90deg, #00E5FF, #2979FF);
	transition: all 0.3s ease;
}
.cta-button:hover {
	box-shadow: 0 0 15px rgba(0, 229, 255, 0.5);
	transform: scale(1.05);
}
.secondary-button {
	border: 1px solid #00E5FF;
	transition: all 0.3s ease;
}
.secondary-button:hover {
	background-color: rgba(0, 229, 255, 0.1);
}
.blur-header {
	backdrop-filter: blur(10px);
	background-color: rgba(26, 26, 26, 0.8);
}
.particles {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 0;
}
.particle {
	position: absolute;
	border-radius: 50%;
	background: rgba(0, 229, 255, 0.5);
	animation: float 15s infinite linear;
}
@keyframes float {
	0% {
		transform: translateY(0) translateX(0) rotate(0deg);
		opacity: 1;
	}
	100% {
		transform: translateY(-100px) translateX(100px) rotate(360deg);
		opacity: 0;
	}
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.feature-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 2rem;
}
.testimonial-card {
	background: linear-gradient(145deg, #222222, #2D2D2D);
	transition: transform 0.3s ease;
}
.testimonial-card:hover {
	transform: scale(1.03);
}
.custom-shape {
	position: absolute;
	opacity: 0.1;
	z-index: 0;
}
