/*------------------------------------*\
	Product pricing
\*------------------------------------*/

.pricing-card-container {
	margin-top: 4rem;
	margin-bottom: 4rem;
}

.pricing-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	width: 100%;
	background: #fff;
	border-radius: $radius;
	border: 1px solid rgba(0,0,0,.1);
	box-shadow: 0 0 3px rgba(39,44,49,.02), 0 5px 22px -6px rgba(39,44,49,.05);
	margin-bottom: 2rem;
}

.pricing-card__header {
	border-radius: $radius $radius 0 0;
	text-align: center;
	padding: 2rem 0 1rem 0;
}

.pricing-card__title {
	margin: 0;
	font-family: $font-family-body;
	color: $color-text-base;
}

.pricing-card__ribbon {
	position: absolute;
	top: 20px;
	right: -35px;
	display: block;
	width: 140px;
	padding: 10px 0;
	background: $color-secondary-dark;
	color: white;
	font-size: 0.7rem;
	text-transform: uppercase;
	line-height: 1;
	text-align: center;
	transform: rotate(45deg);
}

.pricing-card__pricing {
	text-align: center;
}

.pricing-card__price {
	font-size: 2rem;
	line-height: 1em;
	font-weight: bold;

	sup {
		font-weight: normal;
		font-size: 1.3rem;
	}
}

.pricing-card__price-label {
	color: $color-grey-base;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1em;
}

.pricing-card__features {
	list-style: none;
	margin: 1rem 2rem;
	padding: 0;

	li {
		position: relative;
		padding: 0.4rem 0 0.4rem 30px;
		border-bottom: 1px solid $color-grey-light;
	}

	li:last-child {
		border-bottom: 0;
	}

	li:before {
		position: absolute;
		top: 14px;
		left: 0;
		content: ' ';
		width: 16px;
		height: 16px;
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAyNCAxOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxuczpzZXJpZj0iaHR0cDovL3d3dy5zZXJpZi5jb20vIiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlLWxpbmVqb2luOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjI7Ij4gICAgPGcgdHJhbnNmb3JtPSJtYXRyaXgoMSwwLDAsMSwwLjA0LC0zLjg0KSI+ICAgICAgICA8cGF0aCBkPSJNMjMuMTM4LDguMTA4TDkuMDc3LDIyLjE2OUM4Ljk1MSwyMi4yNTkgOC44MzQsMjIuMzA0IDguNzI3LDIyLjMwNEM4LjYyLDIyLjMwNCA4LjUwMywyMi4yNTkgOC4zNzcsMjIuMTY5TDAuMTM1LDEzLjkyN0MtMC4wOTgsMTMuNjk0IC0wLjA5OCwxMy40NiAwLjEzNSwxMy4yMjdMMy41MjksOS44MzNDMy43NjIsOS42IDMuOTk2LDkuNiA0LjIyOSw5LjgzM0w4LjcyNywxNC4zNThMMTkuMDQ0LDQuMDE1QzE5LjI3NywzLjc4MiAxOS41MTEsMy43ODIgMTkuNzQ0LDQuMDE1TDIzLjEzOCw3LjQwOUMyMy4zNzEsNy42NDIgMjMuMzcxLDcuODc2IDIzLjEzOCw4LjEwOUwyMy4xMzgsOC4xMDhaIiBzdHlsZT0iZmlsbDpyZ2IoMzEsNzQsMTI3KTtmaWxsLXJ1bGU6bm9uemVybzsiLz4gICAgPC9nPjwvc3ZnPg==);
		background-repeat: no-repeat;
	}
}

.pricing-card__footer {
	text-align: center;
	padding: 1rem 0;
}

.pricing-card input[type="submit"] {
	background: $color-secondary-dark;
	border: 0;
	padding: 0.6rem 1.8rem;
	margin: 0 auto;
	border-radius: $radius;
	font-weight: 600;
	text-transform: uppercase;
	cursor: pointer;

	&:hover, &:focus {
		background: $color-secondary-dark;
	}

	&:active {
		transform: scale(0.99);
	}
}
