/* Pricing style-1 — plan cards */

.px-pricing.style-1 .px-pricing__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--px-gap-lg);
  margin-bottom: var(--px-space-lg);
}

.px-pricing.style-1 .px-pricing__head-left {
  max-width: 40rem;
  min-width: 0;
}

.px-pricing.style-1 .px-sec-badge {
  margin-bottom: var(--px-gap);
}

.px-pricing.style-1 .px-pricing__head-right {
  max-width: 23.75rem;
  padding-bottom: var(--px-gap-xs);
}

.px-pricing.style-1 .px-pricing__head-right .px-sec-desc {
  margin-bottom: var(--px-gap);
  max-width: none;
}

.px-pricing.style-1 .px-pricing__head-link {
  display: inline-flex;
  align-items: center;
  gap: var(--px-gap-xs);
  font-weight: 700;
  text-decoration: none;
  color: var(--headings-color, var(--px-ink-strong));
}

.px-pricing.style-1 .px-pricing__head-link:hover {
  color: var(--px-color-primary);
}

.px-pricing.style-1 .row.px-pricing__grid {
  --t4-gutter-x: var(--px-gap);
  --t4-gutter-y: var(--px-gap);
  --bs-gutter-x: var(--px-gap);
  --bs-gutter-y: var(--px-gap);
  justify-content: center;
}

.px-pricing.style-1 .px-pricing__card {
  height: 100%;
}

.px-pricing.style-1 .px-pricing__card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: var(--px-gap-xl);
  border: 1px solid var(--px-color-border);
  border-radius: var(--px-radius);
  background: var(--px-color-light);
  transition: transform 0.45s ease, box-shadow 0.45s ease;
}

.px-pricing.style-1 .px-pricing__card:hover {
  transform: translateY(-8px);
  box-shadow: 0 30px 60px color-mix(in srgb, var(--px-ink-strong) 10%, transparent);
}

.px-pricing.style-1 .px-pricing__card.is-featured {
  background: var(--px-color-dark);
  border-color: var(--px-color-dark);
  color: var(--px-muted-on-dark);
}

.px-pricing.style-1 .px-pricing__tag {
  position: absolute;
  top: var(--px-gap-lg);
  right: var(--px-gap-lg);
  padding: var(--px-gap-xs) var(--px-gap-sm);
  border-radius: var(--px-radius-pill);
  background: var(--px-color-primary);
  color: var(--px-color-dark);
  font-size: var(--px-fs-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.px-pricing.style-1 .px-pricing__name {
  margin: 0 0 var(--px-gap-xs);
}

/* Dark featured card: scope heading ink (T4 palette var), don't restyle the heading */
.px-pricing.style-1 .px-pricing__card.is-featured {
  --t4-heading-color: var(--px-ink-on-dark);
  --headings-color: var(--px-ink-on-dark);
}

.px-pricing.style-1 .px-pricing__disc {
  margin: 0 0 var(--px-gap);
  font-size: var(--px-fs-md);
  color: var(--px-muted, var(--px-color-muted));
}

.px-pricing.style-1 .px-pricing__card.is-featured .px-pricing__disc {
  color: var(--px-muted-on-dark);
}

.px-pricing.style-1 .px-pricing__price {
  display: flex;
  align-items: baseline;
  gap: var(--px-gap-xs);
  margin: 0 0 var(--px-gap);
  padding-bottom: var(--px-gap);
  border-bottom: 1px solid color-mix(in srgb, var(--body-text-color, currentColor) 10%, transparent);
}

.px-pricing.style-1 .px-pricing__card.is-featured .px-pricing__price {
  border-bottom-color: color-mix(in srgb, var(--px-color-on-dark) 14%, transparent);
}

.px-pricing.style-1 .px-pricing__amount {
  font-family: var(--heading-font-family, inherit);
  font-size: clamp(2.25rem, 4vw, 3.25rem);
  font-weight: 750;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--headings-color, var(--px-ink-strong));
}

.px-pricing.style-1 .px-pricing__card.is-featured .px-pricing__amount {
  color: var(--px-ink-on-dark);
}

.px-pricing.style-1 .px-pricing__period {
  font-size: var(--px-fs-md);
  font-weight: 600;
  color: var(--px-muted, var(--px-color-muted));
}

.px-pricing.style-1 .px-pricing__card.is-featured .px-pricing__period {
  color: var(--px-muted-on-dark);
}

.px-pricing.style-1 .px-pricing__list {
  display: flex;
  flex-direction: column;
  gap: var(--px-gap-sm);
  margin: 0 0 var(--px-gap-lg);
  padding: 0;
  list-style: none;
  flex: 1;
}

.px-pricing.style-1 .px-pricing__list li {
  display: flex;
  align-items: center;
  gap: var(--px-gap-sm);
  font-size: var(--px-fs-md);
  font-weight: 500;
  color: var(--headings-color, var(--px-ink-strong));
}

.px-pricing.style-1 .px-pricing__card.is-featured .px-pricing__list li {
  color: var(--px-muted-on-dark);
}

.px-pricing.style-1 .px-pricing__check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--px-gap);
  height: var(--px-gap);
  flex-shrink: 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--body-text-color, currentColor) 6%, transparent);
  font-size: var(--px-fs-xs);
  color: var(--headings-color, var(--px-ink-strong));
}

.px-pricing.style-1 .px-pricing__card.is-featured .px-pricing__check {
  background: var(--px-color-primary);
  color: var(--px-color-dark);
}

/* Button = stock Bootstrap (btn btn-primary | btn-outline-dark); layout only here */
.px-pricing.style-1 .px-pricing__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--px-gap-sm);
  width: 100%;
  margin-top: auto;
}

@media (max-width: 991.98px) {
  .px-pricing.style-1 .px-pricing__head {
    flex-wrap: wrap;
    margin-bottom: var(--px-gap-xl);
  }
}

@media (max-width: 767.98px) {
  .px-pricing.style-1 .px-pricing__card {
    padding: var(--px-gap-lg);
  }
}
