/* Base reset and global styles */
*,
*::before,
*::after {
	box-sizing: border-box;
}

:root {
	--janarvuti-transition: 0.3s ease;
	--janarvuti-glow-blue: rgba(59, 130, 246, 0.15);
	--janarvuti-glow-purple: rgba(139, 92, 246, 0.15);
	--janarvuti-gradient-electric: linear-gradient(135deg, #3B82F6, #8B5CF6);
	--janarvuti-gradient-warm: linear-gradient(135deg, #F97316, #F43F5E);
	--janarvuti-gradient-dark: linear-gradient(180deg, #0B0F1A, #141929);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Utility classes */
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* Gradient text utility */
.gradient-text {
	background: var(--janarvuti-gradient-electric);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

/* Gradient button */
.gradient-btn {
	background: var(--janarvuti-gradient-electric) !important;
	color: #FFFFFF !important;
	border: none !important;
	border-radius: 12px !important;
	padding: 1rem 2rem !important;
	font-weight: 600 !important;
	transition: opacity var(--janarvuti-transition), transform var(--janarvuti-transition) !important;
}

.gradient-btn:hover {
	opacity: 0.9;
	transform: translateY(-2px);
}

/* Outline button */
.outline-btn {
	background: transparent !important;
	color: #FFFFFF !important;
	border: 2px solid rgba(255, 255, 255, 0.3) !important;
	border-radius: 12px !important;
	padding: 1rem 2rem !important;
	font-weight: 600 !important;
	transition: border-color var(--janarvuti-transition), background var(--janarvuti-transition) !important;
}

.outline-btn:hover {
	border-color: #FFFFFF !important;
	background: rgba(255, 255, 255, 0.1) !important;
}

/* Warm CTA button */
.warm-btn {
	background: var(--janarvuti-gradient-warm) !important;
	color: #FFFFFF !important;
	border: none !important;
	border-radius: 12px !important;
	padding: 1rem 2rem !important;
	font-weight: 600 !important;
	transition: opacity var(--janarvuti-transition), transform var(--janarvuti-transition) !important;
}

.warm-btn:hover {
	opacity: 0.9;
	transform: translateY(-2px);
}