.position-wrapper {
	position: relative;
	top: -40px;
}

.img-small {
	position: absolute;
	left: 160px;
	top: -29px;
}

.img-small-secondary-bg {
	position: absolute;
	top: 40px;
	right: 160px;
}

.banner {
	background: linear-gradient(135deg, #efe6ff, #ffffff);
	padding-top: 167px;
}

.position-bananer-small {
	transform: rotate(6deg);
	border-radius: 20px;
	box-shadow:
		0 35px 45px rgba(91, 27, 189, 0.15),
		inset 0 1px 4px rgba(255, 255, 255, 0.8);
}

.position-bananer-bottel {
	position: absolute;
	left: 30px;
	top: -10px;
}

.main-image-skinny {
	position: absolute;
	top: 120px;
	left: 120px;
}

.main-image-skinny-ii {
	width: 130px;
	height: 130px;
}

.main-image-skinny-iii {
	position: absolute;
	right: 160px;
	top: 36%;
}

.position-bananer-small-ii {
	transform: rotate(-4deg);
	border-radius: 20px;
	box-shadow:
		0 35px 45px rgba(91, 27, 189, 0.15),
		inset 0 1px 4px rgba(255, 255, 255, 0.8);
}

.position-bananer-bottel-ii {
	position: absolute;
	left: 30px;
	top: -20px;
	height: 150px;
	transform: rotate(1deg);
}

.frame-wrapper {
	position: absolute;
	top: 54%;
	width: 100%;
	z-index: 1;
}

.banner-image.position-relative {
	z-index: 11111;
}

.btn-icon {
	background-color: var(--secondary-color);
	border-radius: 4px;
	font-size: 16px;
	color: var(--extra-color-2);
	border: 1px solid transparent;
	text-align: center;
	font-family: var(--secondary-medium-font);
	font-weight: 500;
	padding: 16px 50px;
	transition: 0.6s all;
	text-decoration: none;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 14px;
	width: fit-content;
	border-radius: 80px;
}

.btn-icon:hover {
	background-color: transparent;
	border: 1px solid var(--secondary-color);
	color: var(--secondary-color);
}

.position-btn-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	top: -120px;
	z-index: 11111111111;
}

.banner {
	backdrop-filter: blur(20px);
	overflow: hidden;
}

.position-bananer-small,
.position-bananer-small-ii {
	transition: transform 0.6s ease;
}

.position-bananer-small:hover,
.position-bananer-small-ii:hover {
	transform: scale(1.05) rotate(6deg);
}

/* ----------------------------- */

.bs-heading-title {
	font-size: 38px;
	font-weight: 700;
	color: #6a0dad;
}

.bs-heading-sub {
	color: #777;
	font-size: 14px;
}

.bs-slider-arrows {
	display: flex;
	gap: 10px;
}

.bs-prev-arrow,
.bs-next-arrow {
	width: 45px;
	height: 45px;
	border-radius: 50%;
	border: none;
	background: #fff;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	transition: 0.3s;
}

.bs-next-arrow {
	background: #6a0dad;
	color: #fff;
}

.bs-prev-arrow:hover,
.bs-next-arrow:hover {
	transform: scale(1.1);
}

.bs-product-card {
	border-radius: 20px;
	margin: 10px;
	transition: 0.4s;
	opacity: unset !important;
}

.bs-product-card:hover {
	transform: translateY(-8px);
	/* box-shadow: 0 15px 25px rgba(0, 0, 0, 0.08); */
}

.bs-product-img {
	background: #f9f9f9;
	padding: 25px;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.bs-add-btn {
	background: #6000a0;
	color: #fff;
	border: 1px solid rgba(0, 0, 0, 0);
	padding: 7px 7px 7px 25px;
	border-radius: 30px;
	margin-top: 20px;
	display: flex;
	width: fit-content;
	align-items: center;
	justify-content: space-between;
	gap: 29px;
	text-decoration: none;
	font-family: var(--secondary-medium-font);
	font-size: 12px;
}

.bs-add-btn:hover {
	color: #7a00ff;
	background: #f0f0f0;
	border: 1px solid #7a00ff;
}

.bs-add-btn:hover span img {
	background-color: transparent;
	filter: brightness(0) invert(1);
}

.bs-add-btn:hover span {
	background-color: #7a00ff;
	border-radius: 50%;
}

.bs-add-btn span img {
	background: #fff;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	object-fit: scale-down;
}

.bs-price {
	font-weight: bold;
	margin-top: 10px;
	color: #5e4d5a;
}

/* Parent container position relative */
.custom-testimonial-slider {
	position: relative;
}

/* Common arrow styles */
.custom-testimonial-slider .custom-slick-arrow {
	position: absolute;
	top: -111px;
	width: 40px;
	height: 40px;
	background: #4a2e1a;
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	cursor: pointer;
	font-size: 18px;
	z-index: 10;
	transition: all 0.3s ease;
	margin-right: 133px;
	border-radius: 5px;
}

/* Hover effect */
.custom-testimonial-slider .custom-slick-arrow:hover {
	background: #6b482c;
	/* slightly lighter */
	transform: scale(1.1);
}

/* Position arrows together at top-right */
.custom-testimonial-slider .custom-slick-arrow.prev {
	right: 58px;
}

.custom-testimonial-slider .custom-slick-arrow.next {
	right: 10px;
	/* right arrow on top-right */
}

/* ---------------------------- */

/* Right Content */
.tr-tag {
	display: inline-block;
	background: #f3d4ff;
	color: #ff00c0;
	padding: 9px 28px;
	border-radius: 30px;
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 15px;
	font-family: var(--secondary-medium-font);
}

.tr-tag:before {
	content: "";
	position: absolute;
	width: 65%;
	height: 2px;
	background: #ffe2fd;
	border-radius: 50%;
	right: 30px;
	/* transform: translateX(-50%); */
	top: 55%;
	margin-top: -10px;
	z-index: -1;
}

.tr-heading {
	font-size: 36px;
	font-weight: 700;
	color: #6a0dad;
	margin: 15px 0;
}

.tr-text {
	color: #777;
}

/* Features */
.tr-feature-box h5 {
	font-weight: 600;
}

.tr-feature-box p {
	font-size: 14px;
	color: #777;
}

.slider-container {
	margin: 0 auto;
	margin-top: 5rem;
	position: relative;
	width: 100%;
	max-width: 800px;
	height: 400px;
	border-radius: 0.7rem;
	overflow: hidden;
}

.before-image,
.after-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

/* Styling the Before/After text */
.before-text,
.after-text {
	position: absolute;
	font-family: system-ui;
	font-size: 14px;
	font-weight: 600;
	color: #3a3a3a;
	z-index: 4;
	padding: 10px 20px;
	background-color: #ffffff9e;
	border-radius: 0.3rem;
	letter-spacing: 2px;
	transition: opacity 0.3s ease-in-out;
}

/* Before text */
.before-text {
	left: 20px;
	/* Position text to the left */
	top: 20px;
	z-index: 5;
}

/* After text */
.after-text {
	right: 20px;
	/* Position text to the right */
	top: 20px;
	z-index: 3;
}

/* Hide the After text initially */
.after-image .after-text {
	visibility: visible;
	z-index: 3;
}

.after-image {
	clip-path: inset(0 50% 0 0);
}

.slider-handle {
	position: absolute;
	top: 0;
	left: 50%;
	width: 0px;
	height: 100%;
	background-color: #fff;
	cursor: pointer;
	z-index: 2;
}

.slider-line {
	position: absolute;
	top: 0;
	left: 50%;
	width: 0px;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	z-index: 1;
}

.pulse-container {
	position: relative;
	display: inline-block;
}

.pulse-container::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 70px;
	/* Larger than the SVG */
	height: 70px;
	border-radius: 50%;
	background-color: #ffffff;
	/* Color of the pulse */
	transform: translate(-50%, -50%) scale(1);
	opacity: 0;
	animation: pulse 1.5s infinite;
}

@keyframes pulse {
	0% {
		transform: translate(-50%, -50%) scale(1);
		opacity: 0.6;
	}

	100% {
		transform: translate(-50%, -50%) scale(1.8);
		opacity: 0;
	}
}

.slider-line svg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	cursor: pointer;
}

/* Prevent text/image selection while dragging */
.slider-container,
.before-image img,
.after-image img {
	user-select: none;
	/* Disable selection on most browsers */
	-webkit-user-select: none;
	/* Safari */
	-moz-user-select: none;
	/* Firefox */
	-ms-user-select: none;
	/* IE10+ */
}

.slider-handle,
.slider-line {
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.before-image::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to right,
			rgba(0, 0, 0, 0.35),
			rgba(0, 0, 0, 0.15),
			transparent);
	pointer-events: none;
	z-index: 2;
}

.before-text,
.after-text {
	bottom: 25px !important;
	/* niche shift */
	top: auto !important;
}

.before-text,
.after-text {
	backdrop-filter: blur(6px);
	background: rgba(255, 255, 255, 0.75);
	font-size: 13px;
	padding: 8px 18px;
}

.slider-line {
	position: absolute;
	top: 0;
	left: 50%;
	width: 0px;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 3;
}

/* Circle */
.custom-arrow-circle {
	width: 65px;
	height: 65px;
	background: rgba(0, 0, 0, 0.75);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 21px;
	color: #fff;
	font-size: 14px;
	cursor: grab;
	position: relative;
	transition: all 0.3s ease;
}

/* Glow effect */
.custom-arrow-circle::before {
	content: "";
	position: absolute;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.2);
	animation: pulseGlow 2s infinite;
	z-index: -1;
}

@keyframes pulseGlow {
	0% {
		transform: scale(1);
		opacity: 0.5;
	}

	100% {
		transform: scale(1.5);
		opacity: 0;
	}
}

/* Hover Effect */
.custom-arrow-circle:hover {
	background: #000;
	transform: scale(1.08);
}

/*  =========================== */
.peptide-section {
	overflow: hidden;
}

.glass-parent {
	padding: 60px 0;
}

.gallery-badge {
	display: inline-block;
	background: #f3d4ff;
	color: #ff00c0;
	padding: 9px 28px;
	border-radius: 30px;
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 15px;
	font-family: var(--secondary-medium-font);
}

.wrapperbadge .gallery-badge:after {
	content: "";
	position: absolute;
	width: 40%;
	height: 2px;
	background: #ffe2fd;
	border-radius: 50%;
	left: 30px;
	/* transform: translateX(-50%); */
	top: 60%;
	margin-top: -10px;
}

.wrapperbadge .gallery-badge:before {
	content: "";
	position: absolute;
	width: 40%;
	height: 2px;
	background: #ffe2fd;
	border-radius: 50%;
	right: 30px;
	/* transform: translateX(-50%); */
	top: 60%;
	margin-top: -10px;
}

.section-title {
	color: #6000a0;
	font-weight: 700;
	font-size: 47px;
	letter-spacing: 1px;
	font-family: var(--secondary-semibold-font);
	text-transform: uppercase;
}

.peptideSwiper {
	padding-bottom: 50px;
}

.peptide-card {
	border-radius: 20px;
	overflow: hidden;
	transition: 0.4s ease;
}

.peptide-card img,
video {
	width: 100%;
	height: 400px;
	object-fit: cover;
	border-radius: 20px;
	border: 1px solid #00000026;
}

section.section-wrapper.research-section {
	background: #f6f5ee;
	border-radius: 30px;
	margin: 70px 20px;
}

/* 👇 Image Stagger Effect */

.card-down {
	margin-top: 100px;
}

/* Hover effect */
.peptide-card:hover {
	transform: scale(1.05);
}

.tsm_unique_testimonial_section {
	background: #f4f2f8;
}

.tsm_unique_badge {
	background: #f3e6ff;
	color: #a100ff;
	padding: 6px 18px;
	border-radius: 50px;
	font-size: 14px;
	font-weight: 600;
}

.tsm_unique_heading {
	font-weight: 800;
	font-size: 32px;
	color: #5b00a7;
}

.tsm_unique_slide {
	padding: 20px;
	transition: 0.4s;
}

.tsm_unique_card {
	background: #f2f2f2;
	padding: 40px 30px;
	border-radius: 20px;
	transition: 0.4s;
	position: relative;
	min-height: 250px;
}

.tsm_unique_quote {
	font-size: 50px;
	color: #ff00aa;
	margin-bottom: 15px;
}

.tsm_unique_rating {
	color: #ffc107;
	font-weight: 600;
}

.tsm_unique_rating span {
	color: #555;
	margin-left: 5px;
}

.tsm_unique_user img {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	margin-top: -35px;
	border: 4px solid white;
}

.tsm_unique_user h5 {
	margin-top: 10px;
	font-weight: 700;
}

.tsm_unique_user small {
	color: #777;
}

/* Active Center Card */
.slick-center .tsm_unique_card {
	background: linear-gradient(135deg, #7a00ff, #a100ff);
	color: white;
	transform: scale(1.08);
}

.slick-center .tsm_unique_quote {
	color: white;
}

.slick-center .tsm_unique_rating span {
	color: #fff;
}

.bs-product-img.product-bg-wrrr .shop-imag-pp {
	width: 100%;
	height: 330px;
	object-fit: scale-down;
	margin-bottom: 10px;
}

/* Reduce side cards */
.slick-slide {
	opacity: 0.6;
}

.slick-center {
	opacity: 1 !important;
}

/* Responsive */
@media (max-width: 768px) {
	.tsm_unique_heading {
		font-size: 22px;
	}
}

.position-bananer-small11 {
	border-radius: 20px;
}

.zx_testimonial_area {
	background: url("../img/bg-teste1.png") no-repeat center center/cover;
	background-size: 100% 100%;
}

.zx_testimonial_item {
	padding: 40px 20px;
	text-align: center;
	transition: all 0.4s ease;
}

.zx_testimonial_card {
	padding: 60px 40px 70px;
	border-radius: 25px;
	position: relative;
	transition: all 0.4s ease;
	background: url("../img/testemonial-slider1.png") no-repeat center center/cover;
	box-shadow:
		0 15px 35px rgb(91 27 189 / 7%),
		inset 0 1px 4px rgb(255 255 255 / 0%);
}

.zx_quote_icon {
	position: absolute;
	top: 25px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 26px;
	z-index: 111;
	width: 60px;
	height: 60px;
	object-fit: scale-down;
}

.zx_testimonial_area .slick-center .zx_quote_icon {
	background: url("../img/quote1.png") no-repeat center center/cover;
	background-size: auto;
}

.zx_testimonial_area .zx_quote_icon {
	background: url("../img/quote.png") no-repeat center center/cover;
	background-size: auto;
}

.zx_testimonial_area .slick-cloned.slick-active .zx_quote_icon {
	background: url("../img/quote12.png") no-repeat center center/cover;
	background-size: auto;
}

.zx_testimonial_text {
	font-size: 18px;
	line-height: 28px;
	color: #6d6d6d;
	margin-bottom: 15px;
	margin-top: 25px;
}

.zx_rating .active_star {
	color: #ffc107;
	font-size: 16px;
}

.zx_rating span {
	margin-left: 8px;
	font-weight: 600;
	color: #7a7a7a;
}

.zx_user_info img {
	width: 75px;
	height: 75px;
	border-radius: 50%;
	border: 6px solid #f2eff7;
}

.zx_user_info h5 {
	margin-top: 11px;
	font-weight: 700;
	color: #000a31;
	font-family: var(--secondary-bold-font);
	font-size: 21px;
}

.zx_user_info span {
	color: #8b8b8b;
	font-size: 14px;
}

/* CENTER ACTIVE STYLE */
.slick-center .zx_testimonial_card {
	color: white;
	transform: scale(1.08);
	background: url("../img/testemonial-slider.png") no-repeat center center/cover;
}

.slick-center .zx_testimonial_text {
	color: white;
}

.zx_testimonial_area .slick-center .zx_rating span {
	color: white;
}

.zx_testimonial_area .zx_slider_wrapper {
	position: relative;
}

/* Common Arrow Style */
.zx_testimonial_area .custom-arrow {
	position: absolute;
	top: 40%;
	transform: translateY(-50%);
	z-index: 10;
	color: #000;
	border: none;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	font-size: 18px;
	cursor: pointer;
	transition: 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	border: none;
	background: #fff;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	transition: 0.3s;
}

/* Hover */
.zx_testimonial_area .custom-arrow:hover {
	background: #6a0dad;
	color: #fff;
}

/* .zx_testimonial_area .slick-prev.custom-arrow,.zx_testimonial_area .slick-next.custom-arrow {
	display: none !important;
} */

/* Left Arrow */
.zx_testimonial_area .slick-prev.custom-arrow {
	left: -10px;
}

/* Right Arrow */
.zx_testimonial_area .slick-next.custom-arrow {
	right: -10px;
}

.zx_testimonial_area .slick-slide {
	opacity: 0.8;
}

.zx_testimonial_area .slick-center {
	opacity: 1 !important;
}

/* Remove default arrows */
.zx_testimonial_area .slick-prev:before,
.zx_testimonial_area .slick-next:before {
	display: none;
}

@media (max-width: 768px) {
	.zx_testimonial_card {
		padding: 50px 25px 70px;
	}
}

.zx_user_info {
	margin-top: -36px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	z-index: 1111;
	bottom: 0;
}

.sd_badge {
	background: #f3e6ff;
	color: #a100ff;
	padding: 6px 15px;
	border-radius: 50px;
	font-weight: 600;
	font-size: 14px;
}

.sd_heading {
	font-weight: 800;
	color: #6b00b3;
	font-size: 36px;
}

.sd_text {
	color: #6c757d;
	font-size: 16px;
	line-height: 28px;
}

.sd_counter {
	font-size: 38px;
	font-weight: 800;
	color: #7a00ff;
	font-family: "Playfair Display", serif;
}

.sd_counter1 {
	font-size: 38px;
	font-weight: 800;
	color: #7a00ff;
	font-family: "Playfair Display", serif;
}

.sd_btn {
	background: linear-gradient(90deg, #7a00ff, #a100ff);
	padding: 12px 30px;
	color: #fff;
	border-radius: 50px;
	text-decoration: none;
}

.sd_btn:hover {
	opacity: 0.9;
}

/* LEFT BOX */
.sd_design_box {
	border-radius: 30px !important;
	height: 600px !important;
	width: 100%;
	background-size: 100% 100% ! important;
	border-radius: 30px;
}

/* Decorative Outline Circles */
.sd_circle_top,
.sd_circle_bottom {
	position: absolute;
	width: 120px;
	height: 120px;
	border: 2px solid rgba(180, 100, 200, 0.5);
	border-radius: 50%;
}

.sd_circle_top {
	top: -30px;
	right: -30px;
}

.sd_circle_bottom {
	bottom: -30px;
	left: -34px;
}

/* Center Ring */
.sd_ring_wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
}

.sd_ring {
	width: 320px;
	height: 320px;
	background: #cc7191;
	background: linear-gradient(90deg,
			rgba(204, 113, 145, 1) 0%,
			rgba(187, 106, 150, 1) 27%,
			rgba(175, 102, 154, 1) 50%,
			rgba(176, 102, 153, 1) 76%,
			rgba(191, 108, 149, 1) 100%);
	border-radius: 50%;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Inner White Circle */
.sd_inner_circle {
	width: 190px;
	height: 190px;
	background: #fff;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Floating Icons */
.sd_icon {
	position: absolute;
	width: 45px;
	height: 45px;
	background: #fff;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #b861a6;
	font-size: 18px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.sd_icon_top {
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
}

.sd_icon_right {
	right: -20px;
	top: 50%;
	transform: translateY(-50%);
}

.sd_icon_bottom {
	bottom: -20px;
	left: 50%;
	transform: translateX(-50%);
}

/* Right Content */
.sd_badge {
	background: #f3e6ff;
	color: #a100ff;
	padding: 6px 15px;
	border-radius: 50px;
	font-size: 14px;
}

.sd_heading {
	font-size: 36px;
	font-weight: 800;
	color: #6b00b3;
}

.sd_text {
	color: #6c757d;
}

/* LEFT IMAGE */
.image-wrapper {
	position: relative;
	border-radius: 25px;
}

.main-img {
	border-radius: 25px;
	width: 100%;
}

/* Overlay effect */
.image-wrapper::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(168, 85, 247, 0.15);
	border-radius: 20px;
}

/* Contact Box */
.contact-box {
	position: absolute;
	bottom: 0px;
	left: 0px;
	background: rgb(94 92 95 / 42%);
	backdrop-filter: blur(10px);
	padding: 25px 85px 25px 30px;
	border-radius: 0px 30px 0px 20px;
	color: #fff;
	z-index: 1111;
}

.phone-icon {
	width: 55px;
	height: 55px;
	background: #e600a8;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 18px;
	position: absolute;
	left: -25px;
}

/* RIGHT CONTENT */
.why-badge {
	background: #f7d4ff;
	color: #a100c9;
	padding: 6px 15px;
	border-radius: 50px;
	font-size: 13px;
	font-weight: 600;
}

.why-title {
	font-size: 36px;
	font-weight: 800;
	color: #5b21b6;
}

.why-text {
	color: #777;
	font-size: 14px;
	margin-bottom: 25px;
}

/* Feature Box */
.feature-box {
	background: URL("../img/border-wrapper.png") no-repeat center center/cover;
	background-size: 100% 100%;
	border-radius: 18px;
	padding: 18px 20px;
	transition: 0.3s ease;
}

.feature-box:hover {
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

.feature-icon {
	width: 60px;
	height: 60px;
	background: #ffd6f4;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #e600a8;
	font-size: 20px;
}

/* Button */
.read-btn {
	background: #6f2dbd;
	color: #fff;
	padding: 13px 34px;
	border-radius: 50px;
	font-weight: 500;
	trasition: 0.3s ease;
}

.read-btn:hover {
	background: #fff;
	color: #6f2dbd;
	border: 1px solid #6f2dbd;
	trasition: 0.3s ease;
}

/* ===============================
   Parent Section
=================================*/
.earning-loyalty-section {
	padding: 100px 0;
	position: relative;
}

/* Container spacing tweak */
.earning-loyalty-container {
	max-width: 1200px;
}

/* ===============================
   Left Content Styling
=================================*/

.loyalty-content-wrapper {
	padding-right: 40px;
}

.loyalty-badge {
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	color: #a855f7;
	background: #f3e8ff;
	padding: 6px 14px;
	border-radius: 50px;
	margin-bottom: 20px;
}

.loyalty-heading {
	font-size: 42px;
	font-weight: 700;
	color: #4c1d95;
	margin-bottom: 25px;
}

.loyalty-description p {
	font-size: 13px;
	color: #555;
	margin-bottom: 0px;
	line-height: 1.7;
}

.loyalty-description {
	margin: 40px 0;
}

/* ===============================
   Example Box
=================================*/

.loyalty-example-box {
	background: #faf6ff;
	padding: 25px;
	margin-top: 32px;
	border-left: 5px solid #6b21a8;
	border-radius: 6px;
}

.example-title {
	font-size: 18px;
	font-weight: 600;
	color: #4000c0;
	margin-bottom: 10px;
	font-family: var(--secondary-semibold-font);
}

.loyalty-example-box p {
	font-size: 15px;
	color: #444;
	margin: 0;
}

/* ===============================
   Image Card
=================================*/

.loyalty-image-card {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.loyalty-image-card img {
	width: 100%;
	height: auto;
	display: block;
}

/* ===============================
   Responsive
=================================*/

@media (max-width: 991px) {
	.loyalty-content-wrapper {
		padding-right: 0;
		margin-bottom: 40px;
	}

	.loyalty-heading {
		font-size: 32px;
	}

	.earning-loyalty-section {
		padding: 60px 0;
	}
}

/* Full screen preloader */
#preloader {
	position: fixed;
	inset: 0;
	background: #6a0dad;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999999;
	overflow: hidden;
}

/* Logo style */
.loader-logo {
	width: 120px;
	transform-origin: center;
}

/* Button */
.procheckout {
	width: 100%;
	border: none;
	border-radius: 30px;
	padding: 14px;
	font-weight: 600;
	color: #fff;
	margin-bottom: 20px;
	transition: 0.3s;
	background: #6000a0;
	font-family: var(--secondary-semibold-font);
	transition: 0.3s;
	position: relative;
}

@keyframes shimmer {
	100% {
		left: 100%;
	}
}

.procheckout::before {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg,
			transparent,
			rgba(255, 255, 255, 0.2),
			transparent);
	animation: shimmer 1.5s infinite;
}

.procheckout:hover {
	opacity: 0.9;
}

.coupon {
	position: relative;
}

.btn.coupon-btn {
	position: absolute;
	bottom: 8px;
	right: 10px;
	background: #fff;
	padding: 4px 14px;
	border-radius: 9px;
}

.coupon .form-control {
	background-color: #8b55d7 !important;
	border: 1px solid #ffff !important;
	padding: 12px 16px;
	font-size: 14px;
	font-family: var(--secondary-regular-font);
	font-weight: 400;
	resize: none;
	border-radius: 10px;
	color: #ffff !important;
}

.coupon .form-control::placeholder {
	color: #ffff !important;
}

video.img-fluid {
	height: 400px;
}

.wrapper-related-production {
	width: 100%;
	height: 240px;
	object-fit: scale-down;
	border-radius: 20px;
}

.change_password_form_submit:hover {
	color: #4000c0 !important;
}

@media (max-width: 1367px) {
	.img-small-secondary-bg {
		position: absolute;
		top: 30px;
		right: 90px;
	}

	.read-btn {
		padding: 13px 22px;
		font-size: 14px;
	}


	.img-small {
		position: absolute;
		left: 100px;
		top: -29px;
	}

	.position-wrapper {
		position: relative;
		top: -40px;
		height: 430px;
		object-fit: fill;
	}

	.sd_design_box {
		height: 500px !important;
	}
}

@media (max-width: 1119px) {
	.img-small-secondary-bg {
		position: absolute;
		top: 30px;
		right: 90px;
	}

	.main-image-skinny-iii {
		position: absolute;
		right: 160px;
		top: 43%;
	}

	.feature-icon {
		height: unset;
	}

	.section-title {
		font-size: 27px;
	}

	.sd_design_box {
		height: 480px !important;
	}

	.padding-banner-wraaa {
		padding: 0 !important;
	}

	.main-image-skinny {
		position: absolute;
		top: 200px;
		left: 100px;
	}

	.frame-wrapper {
		position: absolute;
		top: 63%;
		width: 100%;
		z-index: 1;
	}

	.img-small {
		position: absolute;
		left: 100px;
		top: -29px;
	}

	.position-wrapper {
		position: relative;
		top: -40px;
		height: 430px;
		object-fit: fill;
	}
}

@media (max-width: 991px) {
	section.our-misiion img {
		width: 100%;
		border-radius: 40px;
	}

	.our-misiion {
		padding: 10px 20px;
	}

	.our-misiion h2 {
		margin-top: 40px;
	}

	h2.tittle-innerpages {
		margin-top: 30px;
	}

	.wrapper-product-mainimg {
		width: 110px;
		height: 140px;
		object-fit: scale-down;
	}

	.contact-section .contact-form-wrapper {
		margin-bottom: 0 !important;
	}

	.stats-number {
		font-size: 28px;
		font-weight: 600;
		color: #000;
	}

	.banner {
		padding-top: 117px;
	}


	.position-btn-icon {
		top: -50px;
	}

	.position-wrapper {
		position: relative;
		top: -10px;
	}

	.main-image-skinny {
		position: absolute;
		top: 170px;
		left: -10px;
	}

	.main-image-skinny-iii {
		position: absolute;
		right: 11px;
		top: 40%;
	}

	.sd_design_box {
		height: 560px ! important;
	}

	.bs-products-section {
		margin-top: -20px;
	}

	.section-title {
		font-size: 37px;
	}

	.margintopsection {
		margin-top: 30px;
		border-radius: 60px;
	}

	.slider-container {
		margin-top: -3rem;
	}

	.glass-parent {
		padding: 0px 0;
	}

	.earning-loyalty-section {
		padding: 10px 0 !important;
	}
}

/* Mobile Responsive  */

@media (max-width: 576px) {
	.section-title {
		font-size: 34px;
	}

	.wrapper-pagination-flex .btn {
		font-size: 13px;
		width: unset;
		display: block;
	}

	.wrapper-pagination-flex {
		flex-direction: column;
		gap: 10px;
	}

	#mainHeader {
		height: unset !important;
		top: 40px;
	}

	.banner-image .position-wrapper {
		width: 100%;
		height: unset;
	}

	.section-title {
		font-size: 23px;
	}

	.section-title {
		font-size: 34px;
	}

	.sd_counter {
		font-size: 24px;
	}

	.section-title {
		font-size: 34px;
	}

	.bs-product-img {
		padding: 18px;
	}

	.section-shop .product-card p {
		font-size: 20px;
	}

	.sd_heading {
		font-size: 30px;
	}
}

@media (max-width: 557px) {
	.banner {
		padding-top: 117px;
	}

	.position-wrapper {
		position: relative;
		top: 0px;
	}

	.position-btn-icon {
		top: unset;
	}

	.frame-wrapper {
		top: 76%;
	}

	.sd_design_box {
		height: 370px ! important;
	}

	.custom-accordion .accordion-button {
		font-size: 15px;
		padding-right: 40px;
	}

	.custom-accordion .accordion-item {
		padding: 0;
	}

	.res-img {
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.why-section.py-5 {
		padding-top: 0px ! important;
	}

	.wrapper-related-flex {
		flex-direction: column !important;
	}

	.main-image-skinny-ii {
		width: 70px;
		height: 70px;
	}

	.position-bananer-bottel {
		position: absolute;
		left: 10px;
		top: -10px;
	}

	.position-bananer-bottel-ii {
		position: absolute;
		left: 17px;
		top: -8px;
		height: 80px;
		transform: rotate(1deg);
	}

	.main-image-skinny-iii {
		position: absolute;
		right: 11px;
		top: 48%;
	}

	.position-btn-icon {
		top: unset;
		margin-top: 0 ! important;
	}

	.img-small {
		position: absolute;
		left: 30px;
		top: -29px;
	}

	.img-small img {
		height: 40px;
	}

	.img-small-secondary-bg img {
		height: 33px;
	}

	.img-small-secondary-bg {
		position: absolute;
		top: 0px;
		right: 32px;
	}

	.btn-icon {
		background-color: var(--secondary-color);
		border-radius: 4px;
		font-size: 14px;
		color: var(--extra-color-2);
		border: 1px solid transparent;
		text-align: center;
		font-family: var(--secondary-medium-font);
		font-weight: 500;
		padding: 13px 30px;
		transition: 0.6s all;
		text-decoration: none;
		color: #fff;
		display: flex;
		align-items: center;
		gap: 14px;
		width: fit-content;
		border-radius: 80px;
	}

	.section-title {
		font-size: 27px;
	}

	.tr-tag:before {
		content: "";
		position: absolute;
		width: 35%;
		height: 2px;
		background: #ffe2fd;
		border-radius: 50%;
		right: 30px;
		/* transform: translateX(-50%); */
		top: 55%;
		margin-top: -10px;
	}

	.main-image-skinny {
		position: absolute;
		top: 220px;
		left: -10px;
	}

	.logo img {
		height: 80px;
	}

	.wrapperbadge .gallery-badge:after {
		content: "";
		position: absolute;
		width: 15%;
		height: 2px;
		background: #ffe2fd;
		border-radius: 50%;
		left: 30px;
		/* transform: translateX(-50%); */
		top: 60%;
		margin-top: -10px;
	}

	.wrapperbadge .gallery-badge:before {
		content: "";
		position: absolute;
		width: 19%;
		height: 2px;
		background: #ffe2fd;
		border-radius: 50%;
		right: 30px;
		/* transform: translateX(-50%); */
		top: 60%;
		margin-top: -10px;
	}

	.bs-product-img.product-bg-wrrr .shop-imag-pp {
		width: 70%;
		height: 220px;
		object-fit: scale-down;
		margin-bottom: 10px;
	}

	section.section-wrapper.research-section {
		background: #f6f5ee;
		border-radius: 30px;
		margin: 10px 0px;
	}

	.talk-bottom {
		margin-top: 30px !important;
		padding-bottom: 40px !important;
	}

	.talk-bottom {
		text-align: center !important;
	}

	.wrapper-wihhh {
		width: 100% !important;
		text-align: start ! important;
	}
}