/* Skeleton placeholder (robust shimmer using pseudo-element) */
.skeleton {
	position: relative; /* needed for ::after */
	overflow: hidden;
	/* Light base with brand purple tint (#a855f7) */
	background-color: rgba(168, 85, 247, 0.08);
}
.skeleton::after {
	content: "";
	position: absolute;
	inset: 0;
	transform: translateX(-100%);
	/* Shimmer highlight tinted toward brand purple (#c084fc) */
	background-image: linear-gradient(90deg,
		rgba(192, 132, 252, 0) 0%,
		rgba(192, 132, 252, 0.55) 50%,
		rgba(192, 132, 252, 0) 100%);
	will-change: transform;
	animation: skeleton-shimmer 1.1s ease-in-out infinite;
}

@media (prefers-color-scheme: dark) {
	/* Slightly stronger base in dark */
	.skeleton { background-color: rgba(168, 85, 247, 0.12); }
	.skeleton::after {
		background-image: linear-gradient(90deg,
			rgba(192, 132, 252, 0) 0%,
			rgba(192, 132, 252, 0.45) 50%,
			rgba(192, 132, 252, 0) 100%);
	}
}

.Custom_Shadow{
	filter: drop-shadow(0 0 6px rgba(168, 85, 247, 0.6));
}

.Bigger_Size{
	transform: translate(-50%, -50%) scale(1.5);
    left: 6%;
    top: 22%;
}

@keyframes skeleton-shimmer {
	100% { transform: translateX(100%); }
}

/*-------------------------------------------Css-Reset-------------------------------------------*/
* {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

.Repeated-Background{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	opacity: 0.3;
	z-index: -1;
	background-image: url('../img/Logo-trans.png');
	background-repeat: repeat;
	background-size: 100px 100px;
	background-attachment: fixed;
	background-position: center;
	filter: blur(1px);
	animation: background-sweap 5s linear infinite forwards;
}
@keyframes background-sweap {
	0% {
		background-position: 0px 0px;
	}
	100% {
		background-position: 100px 100px;
	}
}

/* 3D tilt card effect */
.tilt-card {
	perspective: 900px;
	transform-style: preserve-3d;
	transition: transform 180ms ease;
}
.tilt-inner {
	transform-style: preserve-3d;
	transition: transform 180ms ease;
}
@media (prefers-reduced-motion: reduce) {
	.tilt-inner { transition: none; }
}