.standout-product-cards {
	--cards-text-color: var(--block-background-color);
	--cards-bg-color: var(--block-text-color);

	& .product-card-slick-container {
		:is(.standout-product-cards:not(.no-cards-overflow):not([slider-active="no"])) & {
			margin-right: calc( -1 * var(--content-margin) );
			overflow: hidden;
		}

		& .product-card-container {
			--column-count: var(--cards-columns, 3);

			margin-left: calc( -1 * ( .75 * var(--gap-s) ) );
	
			&:not(.slick-slider) {
				display: grid;
				grid-template-columns: repeat(max(calc(var(--column-count) - 2), 1), minmax(0, 1fr));
				gap: calc(1.5 * (1.5 * var(--gap-s))) calc(1.5 * var(--gap-s));
			}
			:is(.standout-product-cards:not(.no-cards-overflow)) :is(.product-card-slick-container:has(.slick-arrow)) &.slick-slider {
				--offcenter-col: calc( 100% / var(--column-count) );
				--offcenter-space: calc( ( .75 * var(--gap-s) ) * 2 );
				--offcenter-col-tot: calc( ( var(--offcenter-col) / 2 ) - var(--offcenter-space) );
				--offcenter-tot: calc( -1 * var(--offcenter-col-tot) );
	
				margin-right: var(--offcenter-tot);
				padding-inline: 0;
			}
			:is(.product-card-slick-container:has(.slick-arrow)) &.slick-slider {
				margin-right: calc(-1 * (.75 * var(--gap-s)));
				padding-inline: 0;
			}
	
			& .slick-track {
				display: flex;
			}
	
			& .product-card--item {
				display: flex;
				flex-direction: column;
				align-items: flex-start;
				gap: .5em;
				height: auto;
				padding: calc(1.5 * var(--gap-s));
				font-size: var(--p-s);
				line-height: 1;

				&:not(.product-card--item-placeholder) {
					background-color: var(--cards-bg-color);
					color: var(--cards-text-color);
				}
	
				&.slick-slide {
					margin-inline: calc(.75 * var(--gap-s));
				}

				&.product-card--item-placeholder {
					order: 999;
				}
				:is(.standout-product-cards.no-cards-overflow) &.product-card--item-placeholder {
					display: none;
				}

				& .product-card--item--heading {
					font-size: 1.65em;
					font-weight: 500;
				}
			
				& .product-card--item--short-description {
					line-height: var(--line-height);
				}
			
				& .product-card--item--price {
					display: flex;
					align-items: flex-end;
					flex-wrap: wrap;
					row-gap: .5em;
					margin-top: .65em;
					line-height: .7;

					& .product-card--item--price-value {
						flex-basis: max-content;
						flex-shrink: 1;
						max-width: 100%;
						font-size: var(--h4-l);
						font-weight: 500;
					}

					& .product-card--item--price-suffix {
						flex-basis: max-content;
						flex-shrink: 1;
						max-width: 100%;
						line-height: 0.8;
					}
				}
			
				& .product-card--item--feature-list {
					width: 100%;
					margin-top: calc(1.25 * var(--gap-s) - .5em);
					padding-top: calc(1.25 * var(--gap-s));
					border-top: 1px solid currentColor;
		
					&:not(:last-child) {
						margin-bottom: 1em;
					}
				}
			
				& .product-card--item--feature-list--row {
					display: flex;
					gap: .35em;

					&:not(:last-child) {
						margin-bottom: .7em;
					}
				}
			
				& .product-card--item--feature-list--row--icon svg path {
					fill: var(--cards-bg-color) !important;
				}
			
				& .product-card--item--feature-list--row--title {
					font-size: .9em;
				}
			
				& .product-card--item--link {
					position: relative;
					width: 100%;
					margin-top: auto;
			
					& .standout-button {
						--p: var(--p-s);
						--button-color: var(--cards-bg-color);
			
						position: relative;
						width: 100%;
						background-color: var(--cards-text-color);
						cursor: pointer;
			
						&:has(.standout-button-element.has-borders) {
							border: 1px solid var(--cards-text-color);
						}
			
						&:before {
							top: 0;
							left: 0;
							width: 0;
							opacity: 0;
							height: 100%;
							content: '' !important;
							position: absolute;
							border-bottom: 1px solid var(--button-color) !important;
							transition: var(--transition) !important;
						}
						&:has(.standout-button-element.has-borders):before {
							opacity: 1;
							background-color: var(--button-color);
						}
						&:hover:before {
							width: 100%;
							opacity: 1;
						}
			
						& .standout-max-container {
							text-align: center;
						}
			
						& .standout-button-element {
							--button-color: var(--cards-bg-color);
			
							border: none !important;
			
							&.has-borders {
								border-color: var(--cards-text-color) !important;
							}
			
							&:before {
								content: none !important;
							}
						}
			
						&:hover .standout-button-icon {
							margin-left: calc(100% - 2.4em);
							rotate: 0deg;
							filter: invert(1) brightness(2) contrast(2);
						}
			
						&:hover .standout-button-text {
							translate: -1em;
							filter: invert(1) brightness(2) contrast(2);
						}
					}
				}
			
				& .product-card--item--disclaimer {
					align-self: center;
					margin-top: .5em;
					font-size: .8em;
				}
			}
		}

		& .product-card-slick-navigation {
			display: flex;
			justify-content: flex-end;
			gap: var(--gap-s);
			margin-top: calc( 1.5 * var(--gap-s) );
			margin-right: var(--content-margin);

			:is(.standout-product-cards.no-cards-overflow) & {
				margin-right: 0;
			}

			& .slick-arrow {
				display: inline-block;
				width: auto;
				height: auto;
				padding: .25em 0;
				color: var(--block-text-color);
				font-size: var(--p-s);
				line-height: 0;
				background-color: transparent;
				border-radius: 0;
				box-shadow: none;
				transition: var(--transition);
				transition-property: color, background-color, opacity;
				transform: none;
				border: none;
				outline: none;
				cursor: pointer;

				&.slick-disabled {
					opacity: .5;
					cursor: default;
				}
			}
		}
	}
}