/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 20 2026 | 01:47:26 */
/* =========================================================
   ALUX SHOP / SHOP ALL PRODUCT CARDS
   Elementor Loop Template: 708
   FINAL CLEAN REPLACEMENT

   IMPORTANT:
   Delete the previous Shop-card CSS and use ONLY this block.
========================================================= */


/* =========================================================
   1. CARD SHELL
========================================================= */

.elementor-708.e-loop-item {
	overflow: hidden !important;

	background: #ffffff !important;

	border: 1px solid #ded9d1 !important;
	border-radius: 12px !important;

	box-shadow: 0 2px 7px rgba(0,0,0,.045) !important;
}


.elementor-708 .elementor-element-5e4f934 {
	position: relative !important;

	overflow: hidden !important;

	width: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: #ffffff !important;

	border-radius: 12px !important;
}


.elementor-708
.elementor-element-5e4f934
> .e-con-inner {
	display: block !important;

	width: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	gap: 0 !important;
}


/* =========================================================
   2. PRODUCT IMAGE
========================================================= */

.elementor-708 .elementor-element-69f5188 {
	width: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;
}


.elementor-708 .elementor-element-69f5188 a {
	display: block !important;

	width: 100% !important;
}


.elementor-708 .elementor-element-69f5188 img {
	display: block !important;

	width: 100% !important;
	height: auto !important;

	aspect-ratio: 1.20 / 1 !important;

	object-fit: cover !important;
	object-position: center center !important;

	margin: 0 !important;

	border-radius: 11px 11px 0 0 !important;

	transition: transform .2s ease !important;
}


.elementor-708:hover
.elementor-element-69f5188 img {
	transform: scale(1.01) !important;
}


/* =========================================================
   3. REMOVE STOCK / UNUSED SHORTCODE
========================================================= */

.elementor-708 .elementor-element-10601df,
.elementor-708 .stock,
.elementor-708 .in-stock,
.elementor-708 .out-of-stock,
.elementor-708 [class*="stock-badge"],
.elementor-708 [class*="instock"] {
	display: none !important;
}


/* =========================================================
   4. PURITY BADGE
========================================================= */

.elementor-708 .elementor-element-c1fc63e {
	position: absolute !important;

	top: 9px !important;
	left: 9px !important;
	right: auto !important;
	bottom: auto !important;

	z-index: 20 !important;

	display: inline-flex !important;

	flex-direction: row !important;
	align-items: center !important;
	justify-content: flex-start !important;

	gap: 4px !important;

	width: auto !important;
	min-width: 0 !important;
	max-width: max-content !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 5px 8px !important;

	background: rgba(8,8,8,.88) !important;

	border: 1px solid #d99a31 !important;
	border-radius: 20px !important;

	box-shadow: none !important;
}


/* Purity icon */
.elementor-708 .elementor-element-923cd05 {
	flex: 0 0 auto !important;

	width: auto !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;
}


.elementor-708
.elementor-element-923cd05
.elementor-icon-wrapper {
	display: flex !important;

	align-items: center !important;

	margin: 0 !important;
}


.elementor-708
.elementor-element-923cd05
.elementor-icon {
	display: flex !important;

	align-items: center !important;
	justify-content: center !important;

	width: 13px !important;
	height: 13px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	color: #e0a02d !important;

	border: 0 !important;
}


.elementor-708
.elementor-element-923cd05
.elementor-icon svg {
	width: 11px !important;
	height: 11px !important;

	fill: currentColor !important;
}


/* Purity text */
.elementor-708 .elementor-element-096592f {
	flex: 0 0 auto !important;

	width: auto !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;
}


.elementor-708
.elementor-element-096592f
.elementor-heading-title {
	margin: 0 !important;
	padding: 0 !important;

	color: #ffffff !important;

	font-family: inherit !important;
	font-size: 9px !important;
	font-weight: 700 !important;
	line-height: 1 !important;

	letter-spacing: 0 !important;

	white-space: nowrap !important;
}


.elementor-708
.elementor-element-096592f
.elementor-heading-title span {
	color: #e0a02d !important;
}


/* =========================================================
   5. PRODUCT INFO AREA

   We use CSS Grid and flatten Elementor's nested containers:
   Row 1 = Product title | Price
   Row 2 = As low as     | VIEW →
========================================================= */

.elementor-708 .elementor-element-466d249 {
	position: relative !important;

	display: grid !important;

	grid-template-columns:
		minmax(0, 1fr)
		auto !important;

	grid-template-rows:
		auto
		auto !important;

	column-gap: 10px !important;
	row-gap: 10px !important;

	align-items: center !important;

	width: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 11px 11px 10px !important;

	background: #ffffff !important;

	border: 0 !important;
	border-radius: 0 0 11px 11px !important;
}


/*
 * Flatten these two Elementor containers so their children
 * can participate directly in the grid above.
 */
.elementor-708 .elementor-element-4c55dc3,
.elementor-708 .elementor-element-b2fef48 {
	display: contents !important;
}


/* =========================================================
   6. PRODUCT TITLE — TOP LEFT
========================================================= */

.elementor-708 .elementor-element-735ccf3 {
	grid-column: 1 !important;
	grid-row: 1 !important;

	align-self: center !important;

	width: auto !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}


.elementor-708
.elementor-element-735ccf3
.elementor-heading-title {
	margin: 0 !important;
	padding: 0 !important;

	color: #252525 !important;

	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;

	letter-spacing: -.15px !important;
}


.elementor-708
.elementor-element-735ccf3
.elementor-heading-title a {
	color: inherit !important;

	text-decoration: none !important;
}


/* =========================================================
   7. PRICE — TOP RIGHT
========================================================= */

.elementor-708 .elementor-element-7d166e1 {
	grid-column: 2 !important;
	grid-row: 1 !important;

	align-self: center !important;
	justify-self: end !important;

	position: static !important;

	width: auto !important;

	margin: 0 !important;
	padding: 0 !important;
}


.elementor-708
.elementor-element-7d166e1
.elementor-heading-title {
	margin: 0 !important;
	padding: 0 !important;

	color: #d2922b !important;

	font-family: inherit !important;
	font-size: 18px !important;
	font-weight: 750 !important;
	line-height: 1 !important;

	letter-spacing: -.2px !important;

	white-space: nowrap !important;
}


.elementor-708
.elementor-element-7d166e1
.elementor-heading-title a {
	color: inherit !important;

	text-decoration: none !important;
}


/* =========================================================
   8. "AS LOW AS" — BOTTOM LEFT
========================================================= */

.elementor-708 .elementor-element-987265b {
	grid-column: 1 !important;
	grid-row: 2 !important;

	align-self: center !important;
	justify-self: start !important;

	display: inline-flex !important;

	align-items: center !important;

	gap: 5px !important;

	width: auto !important;

	margin: 0 !important;
	padding: 0 !important;
}


/* Small tag symbol */
.elementor-708 .elementor-element-987265b::before {
	content: "◇";

	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	margin: 0 !important;

	color: #6a7178 !important;

	font-size: 12px !important;
	line-height: 1 !important;
}


.elementor-708
.elementor-element-987265b
.elementor-heading-title {
	margin: 0 !important;
	padding: 0 !important;

	color: #696d72 !important;

	font-family: inherit !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	line-height: 1.1 !important;

	letter-spacing: 0 !important;
}


.elementor-708
.elementor-element-987265b
.elementor-heading-title a {
	color: inherit !important;

	text-decoration: none !important;
}


/* =========================================================
   9. VIEW BUTTON — BOTTOM RIGHT
========================================================= */

.elementor-708 .elementor-element-181ba5a {
	grid-column: 2 !important;
	grid-row: 2 !important;

	align-self: center !important;
	justify-self: end !important;

	width: auto !important;

	margin: 0 !important;
	padding: 0 !important;
}


.elementor-708
.elementor-element-181ba5a
.elementor-button {
	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	width: auto !important;
	min-width: 78px !important;
	min-height: 31px !important;

	margin: 0 !important;
	padding: 7px 11px !important;

	background: #ffffff !important;

	border: 1px solid #d39a43 !important;
	border-radius: 18px !important;

	box-shadow: none !important;

	color: #242424 !important;

	font-family: inherit !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	line-height: 1 !important;

	letter-spacing: .1px !important;

	text-transform: uppercase !important;
}


.elementor-708
.elementor-element-181ba5a
.elementor-button:hover {
	background: #fff8ec !important;

	border-color: #cb8824 !important;

	color: #222 !important;

	transform: none !important;
}


.elementor-708
.elementor-element-181ba5a
.elementor-button-content-wrapper {
	display: flex !important;

	flex-direction: row-reverse !important;

	align-items: center !important;
	justify-content: center !important;

	gap: 6px !important;
}


.elementor-708
.elementor-element-181ba5a
.elementor-button-icon {
	display: flex !important;

	align-items: center !important;

	margin: 0 !important;
}


.elementor-708
.elementor-element-181ba5a
.elementor-button-icon svg {
	display: block !important;

	width: 11px !important;
	height: 11px !important;

	fill: currentColor !important;
}


/* =========================================================
   10. DESKTOP
========================================================= */

@media (min-width: 768px) {

	.elementor-708 .elementor-element-69f5188 img {
		aspect-ratio:
			1.22 / 1 !important;
	}


	.elementor-708 .elementor-element-466d249 {
		padding:
			12px 12px
			11px !important;

		column-gap:
			12px !important;

		row-gap:
			11px !important;
	}


	.elementor-708
	.elementor-element-735ccf3
	.elementor-heading-title {
		font-size:
			15px !important;
	}


	.elementor-708
	.elementor-element-7d166e1
	.elementor-heading-title {
		font-size:
			18px !important;
	}


	.elementor-708
	.elementor-element-987265b
	.elementor-heading-title {
		font-size:
			10px !important;
	}


	.elementor-708
	.elementor-element-181ba5a
	.elementor-button {
		min-width:
			80px !important;

		min-height:
			32px !important;

		padding:
			7px 12px !important;

		font-size:
			10px !important;
	}


	.elementor-708
	.elementor-element-096592f
	.elementor-heading-title {
		font-size:
			9px !important;
	}

}


/* =========================================================
   11. MOBILE
   Reference: compact 2-column cards with readable text
========================================================= */

@media (max-width: 767px) {

	.elementor-708.e-loop-item {
		border-radius:
			10px !important;

		box-shadow:
			0 1px 5px
			rgba(0,0,0,.05) !important;
	}


	.elementor-708 .elementor-element-5e4f934 {
		border-radius:
			10px !important;
	}


	/* Image */
	.elementor-708 .elementor-element-69f5188 img {
		aspect-ratio:
			1.08 / 1 !important;

		border-radius:
			9px 9px 0 0 !important;
	}


	/* Purity badge */
	.elementor-708 .elementor-element-c1fc63e {
		top:
			6px !important;

		left:
			6px !important;

		gap:
			3px !important;

		padding:
			4px 6px !important;
	}


	.elementor-708
	.elementor-element-923cd05
	.elementor-icon {
		width:
			10px !important;

		height:
			10px !important;
	}


	.elementor-708
	.elementor-element-923cd05
	.elementor-icon svg {
		width:
			9px !important;

		height:
			9px !important;
	}


	.elementor-708
	.elementor-element-096592f
	.elementor-heading-title {
		font-size:
			7px !important;
	}


	/* Info section */
	.elementor-708 .elementor-element-466d249 {
		padding:
			8px 7px
			7px !important;

		column-gap:
			6px !important;

		row-gap:
			8px !important;
	}


	/* Name */
	.elementor-708
	.elementor-element-735ccf3
	.elementor-heading-title {
		font-size:
			10.5px !important;

		font-weight:
			700 !important;

		line-height:
			1.15 !important;
	}


	/* Price */
	.elementor-708
	.elementor-element-7d166e1
	.elementor-heading-title {
		font-size:
			14px !important;
	}


	/* As low as */
	.elementor-708 .elementor-element-987265b {
		gap:
			3px !important;
	}


	.elementor-708
	.elementor-element-987265b::before {
		font-size:
			8px !important;
	}


	.elementor-708
	.elementor-element-987265b
	.elementor-heading-title {
		font-size:
			7.5px !important;

		font-weight:
			500 !important;
	}


	/* VIEW */
	.elementor-708
	.elementor-element-181ba5a
	.elementor-button {
		min-width:
			56px !important;

		min-height:
			25px !important;

		padding:
			5px 7px !important;

		border-radius:
			15px !important;

		font-size:
			7.5px !important;
	}


	.elementor-708
	.elementor-element-181ba5a
	.elementor-button-content-wrapper {
		gap:
			4px !important;
	}


	.elementor-708
	.elementor-element-181ba5a
	.elementor-button-icon svg {
		width:
			8px !important;

		height:
			8px !important;
	}

}


/* =========================================================
   12. SMALL MOBILE
========================================================= */

@media (max-width: 390px) {

	.elementor-708 .elementor-element-466d249 {
		padding:
			7px 6px
			7px !important;

		column-gap:
			5px !important;

		row-gap:
			7px !important;
	}


	.elementor-708
	.elementor-element-735ccf3
	.elementor-heading-title {
		font-size:
			10px !important;
	}


	.elementor-708
	.elementor-element-7d166e1
	.elementor-heading-title {
		font-size:
			13px !important;
	}


	.elementor-708
	.elementor-element-987265b
	.elementor-heading-title {
		font-size:
			7px !important;
	}


	.elementor-708
	.elementor-element-181ba5a
	.elementor-button {
		min-width:
			52px !important;

		min-height:
			24px !important;

		padding:
			5px 6px !important;

		font-size:
			7px !important;
	}

}
.elementor-708 .elementor-element-181ba5a .elementor-button{
	border: none !important;
}

.elementor-708 .elementor-element-181ba5a .elementor-button:hover{
	border-color: none !important;
	background-color: none !important;
}

/* =========================================================
   SHOP CARDS — TINY FONT SIZE INCREASE
========================================================= */

/* Product name */
.elementor-708
.elementor-element-735ccf3
.elementor-heading-title {
	font-size: 16px !important;
}

/* Top-right price */
.elementor-708
.elementor-element-7d166e1
.elementor-heading-title {
	font-size: 19px !important;
}

/* As low as */
.elementor-708
.elementor-element-987265b
.elementor-heading-title {
	font-size: 11.5px !important;
}

/* Bottom per-vial / low price */
.elementor-708
.alux-card-low-price {
	font-size: 12.5px !important;
}

/* VIEW */
.elementor-708
.elementor-element-181ba5a
.elementor-button {
	font-size: 10.5px !important;
}

/* Purity badge */
.elementor-708
.elementor-element-096592f
.elementor-heading-title {
	font-size: 9.5px !important;
}


/* MOBILE — just one notch bigger */
@media (max-width: 767px) {

	.elementor-708
	.elementor-element-735ccf3
	.elementor-heading-title {
		font-size: 11px !important;
	}

	.elementor-708
	.elementor-element-7d166e1
	.elementor-heading-title {
		font-size: 14.5px !important;
	}

	.elementor-708
	.elementor-element-987265b
	.elementor-heading-title {
		font-size: 8.4px !important;
	}

	.elementor-708
	.alux-card-low-price {
		font-size: 9px !important;
	}

	.elementor-708
	.elementor-element-181ba5a
	.elementor-button {
		font-size: 8.4px !important;
	}

	.elementor-708
	.elementor-element-096592f
	.elementor-heading-title {
		font-size: 7.4px !important;
	}

}

/* Make ALL purity text gold */
.elementor-708
.elementor-element-096592f
.elementor-heading-title,
.elementor-708
.elementor-element-096592f
.elementor-heading-title span {
	color: #e0a02d !important;
}