/* ==========================================================================
   Pricing packages (Tastyc "pricing-style-2", pricing page s0).
   Measured at 1532px: 3 × 420px cards, 20px apart, 664px tall. Card = surface panel,
   15px padding, 1px hairline (gold on the featured card), 30px inside that:
   icon 70 → 15 → name 14 → 30 → price 88 → 20 → list 222 → 30 → button 50 → 60 bottom.
   ========================================================================== */
.sv-pricing { padding: 70px 0 130px; }

.sv-pricing__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.sv-pricing__card {
	position: relative;
	padding: 45px 45px 75px;
	background: #2b1519;
	text-align: center;
	color: var(--sv-heading);
}
.sv-pricing__card::before {
	content: "";
	position: absolute; inset: 15px;
	border: 1px solid var(--sv-line);
	pointer-events: none;
	transition: border-color .4s var(--sv-ease);
}
.sv-pricing__card--featured::before, .sv-pricing__card:hover::before { border-color: var(--sv-accent); }

.sv-pricing__icon { display: inline-flex; width: 70px; height: 70px; margin-bottom: 15px; color: #fff; }
.sv-pricing__icon svg { width: 70px; height: 70px; }

.sv-pricing__name {
	margin: 0 0 30px;
	font-family: var(--sv-body-font);
	font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}

/* Price row: small sign, 60px Fraunces figure and the period, all centred on one line */
.sv-pricing__price {
	display: flex; align-items: center; justify-content: center; gap: 12px;
	padding: 8px 0; margin-bottom: 20px;
	color: #fff;
}
.sv-pricing__currency { font-family: var(--sv-heading-font); font-size: 24px; font-weight: 400; line-height: 1.2; }
.sv-pricing__amount { font-family: var(--sv-heading-font); font-size: 60px; font-weight: 500; line-height: 1.2; }
.sv-pricing__period { font-size: 16px; line-height: 1.8; }

/* Feature rows: 40px tall with a faint dotted rule under each; "off" rows are struck through */
.sv-pricing__features { list-style: none; margin: 0 0 30px; padding: 10px 0; opacity: .7; }
.sv-pricing__features li {
	padding: 5px 0;
	font-size: 16px; line-height: 30px;
	color: #fff;
	border-bottom: 1px dotted rgba(255, 255, 255, .15);
}
.sv-pricing__features li.is-off { text-decoration: line-through; opacity: .55; }

.sv-pricing__action { line-height: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
	.sv-pricing { padding: 60px 0 100px; }
	.sv-pricing__grid { grid-template-columns: repeat(2, minmax(0, 420px)); justify-content: center; }
	/* An odd last card sits centred under the pair */
	.sv-pricing__card:last-child:nth-child(odd) { grid-column: 1 / -1; width: 100%; max-width: 420px; justify-self: center; }
}
@media (max-width: 767px) {
	.sv-pricing { padding: 50px 0 80px; }
	.sv-pricing__grid { grid-template-columns: minmax(0, 420px); }
	.sv-pricing__card { padding: 40px 30px 65px; }
	.sv-pricing__card::before { inset: 12px; }
	.sv-pricing__amount { font-size: 54px; }
}
