/* ============================================================
   Digital Experts - pricing in the home design system
   2026.10.06. Scoped to main.dx.dx-price-page. Tier details are
   unchanged from the previous page; only the layout moved.
   ============================================================ */

.dx-price-page .dx-price-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.dx-price-page .dx-price-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--dx-ink-line);
  border-radius: 24px;
  padding: 28px 24px 24px;
  background: var(--dx-white);
  color: var(--dx-burgundy);
}

.dx-price-page .dx-price-card.is-featured { background: var(--dx-burgundy); border-color: var(--dx-burgundy); color: var(--dx-cream); }

.dx-price-page .dx-price-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 18px; }
.dx-price-page .dx-price-top .dx-label { color: var(--dx-green); }
.dx-price-page .is-featured .dx-price-top .dx-label { color: var(--dx-cream); }
.dx-price-page .dx-price-flag {
  font-family: var(--dx-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--dx-mustard);
  color: var(--dx-burgundy);
  white-space: nowrap;
}

.dx-price-page .dx-price-amount {
  font-family: var(--dx-wide);
  font-stretch: 125%;
  font-variation-settings: "wdth" 125;
  font-weight: 700;
  font-size: clamp(36px, 3.4vw, 48px);
  line-height: 1;
  margin: 0 0 14px;
}
.dx-price-page .dx-price-amount small { font-family: var(--dx-sans); font-weight: 500; font-size: 14px; letter-spacing: 0; margin-left: 4px; opacity: 0.6; }

.dx-price-page .dx-price-desc { font-family: var(--dx-sans); font-size: 15px; line-height: 1.45; margin: 0 0 22px; min-height: 4.35em; color: var(--dx-ink-78); }
.dx-price-page .is-featured .dx-price-desc { color: var(--dx-cream-70); }

.dx-price-page .dx-price-feat { list-style: none; margin: 0 0 24px; padding: 0; }
.dx-price-page .dx-price-feat li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--dx-ink-line);
  font-family: var(--dx-sans);
  font-size: 14px;
  line-height: 1.35;
}
.dx-price-page .is-featured .dx-price-feat li { border-top-color: var(--dx-cream-line); }
.dx-price-page .dx-price-feat li span:first-child { opacity: 0.7; }
.dx-price-page .dx-price-feat li span:last-child { font-weight: 600; text-align: right; }

.dx-price-page .dx-price-card .dx-btn { margin-top: auto; justify-content: center; }
.dx-price-page .dx-price-card:not(.is-featured) .dx-btn { background: var(--dx-burgundy); color: var(--dx-cream); }
.dx-price-page .dx-price-card:not(.is-featured) .dx-btn:hover { background: var(--dx-green); }

.dx-price-page .dx-price-note {
  margin: var(--dx-gap-m) 0 0;
  padding-top: 24px;
  border-top: 1px solid var(--dx-ink-line);
  font-family: var(--dx-sans);
  font-size: 15px;
  line-height: 1.5;
  color: var(--dx-ink-78);
  max-width: 70ch;
}

@media (max-width: 1080px) {
  .dx-price-page .dx-price-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .dx-price-page .dx-price-grid { grid-template-columns: 1fr; }
  .dx-price-page .dx-price-desc { min-height: 0; }
}