/**
 * Theme Name:     Hello Elementor Child
 * Author:         Elementor Team
 * Template:       hello-elementor
 * Text Domain:	   hello-elementor-child
 * Description:    Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
 */

 *{
 	font-family: Pretendard Variable !important;
 }


 .card-wrapper .card-content {
 	height: 60%;
 	margin-bottom: -500px;
 	transition: 
 	margin-bottom 1.8s ease,
 	height 1.8s ease;
 	overflow: hidden;
 }

 .card-wrapper:hover .card-content {
 	margin-bottom: 0;
 	height: 100%;
 	cursor: pointer;
 }

 .card-content .e-con-inner {
 	transition: 
 	transform 1.5s ease,
 	opacity 1.2s ease;
 	opacity: 1;
 	transform: translateY(0);
 }

 .card-wrapper:not(:hover) .card-content .e-con-inner {
 	opacity: 0;
 	transform: translateY(30px);
 }

 .card-wrapper:hover .card-content .e-con-inner {
 	opacity: 1;
 	transform: translateY(0px);
 	justify-content: end;
 }

 @media(max-width:1024px) {
 	.card-content {
 		height: 54%;
 	}
 }

 .slide {
 	position: absolute;
 	top: 25%;
 	left: 10%;
 	width: 80%;
 	min-height: 250px;
 	background-color: #121413;
 	border: 1px solid #fff;
 	border-radius: 45px;
 	padding:15px;
 	opacity: 0;
 	transform: translateY(30%) scale(0.8);
 	z-index: 1;
 }

 /* Only active slide animates in */
 .slide--active {
 	animation: slideIn 0.5s forwards;
 	z-index: 9;
 }

 /* Previous slide slides up */
 .prev {
 	animation: slideUp 0.5s forwards;
 	opacity: 0.3;
 	z-index: 5;
 }

 /* Next slide slides down */
 .next {
 	animation: slideDown 0.5s forwards;
 	opacity: 0.3;
 	z-index: 5;
 }

 @keyframes slideIn {
 	from {
 		opacity: 0;
 		transform: translateY(20%) scale(0.8);
 	}
 	to {
 		opacity: 1;
 		transform: translateY(0) scale(1);
 	}
 }

 @keyframes slideUp {
 	from {
 		opacity: 1;
 		transform: translateY(0) scale(1);
 	}
 	to {
 		opacity: 0.1;
 		transform: translateY(-20%) scale(0.9);
 	}
 }

 @keyframes slideDown {
 	from {
 		opacity: 1;
 		transform: translateY(0) scale(1);
 	}
 	to {
 		opacity: 0.1;
 		transform: translateY(30%) scale(0.9);
 	}
 }





 .infinite-rotate {
 	animation: infinite-rotate 20s linear infinite;
 }

 @keyframes infinite-rotate {
 	from {
 		transform: rotate(0deg);
 	}
 	to {
 		transform: rotate(360deg);
 	}
 }



 @media(max-width:768px) {
	#page{
	overflow-x: hidden;
}
 	.single-small-gallery img{
 		max-width: 80px;
 	}
 	.single-small-gallery figure{
 		padding:0px !important;
 	}
 	.single-small-gallery .gallery{
 		display: flex;
 		flex-wrap: wrap;
 		gap: 10px;
 	}
 	.single-small-gallery .gallery-item{
 		width: 26% !important;
 	}

 	.form-wraper .columen-2 {
 		flex-direction: column;
 	}

 	.form-wraper .wpcf7-submit {
 		min-width: 166px !important;
 	}

 	.form-wraper {
 		padding: 16px !important;
 		border-radius: 10px !important;
 	}

 	.slider-wraper .slide p{
 		font-size: 16px !important;
 	}

 }



/* Hide default cursor */
body {
  cursor: none;
}

/* Cursor wrapper */
#mouse-cursor {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: opacity 0.2s ease;
}

/* SVG circle */
.cursor__inner {
  fill: none;
  stroke: #000;
  stroke-width: 2;
  transition: transform 0.2s ease;
}

/* Text */
#mouse-cursor span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 12px;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.2s ease;
}

/* Active state */
#mouse-cursor.active span {
  opacity: 1;
}
