.sale-quote-demo {
  padding: clamp(24px, 5vw, 44px);
  margin-bottom: 48px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--cloud);
}
.sale-quote-demo .quote-eyebrow { color: var(--sea); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sale-quote-demo h2 { font-size: clamp(24px, 4vw, 32px); margin: 12px 0; }
.sale-quote-demo .quote-controls { display: flex; gap: 8px; flex-wrap: wrap; margin: 22px 0; }
.sale-quote-demo button { border: 1px solid var(--line); border-radius: 9px; background: white; padding: 9px 15px; cursor: pointer; }
.sale-quote-demo button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: white; }
.sale-quote-demo .quote-list { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.sale-quote-demo .quote-list li { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; padding: 15px 18px; border: 1px solid var(--line); border-radius: 12px; background: white; }
.sale-quote-demo [data-quote-status] { grid-column: 1 / -1; font-size: 12px; color: var(--muted); }
.sale-quote-demo [data-eligible="true"] { border-color: #9ac8bb; }
.sale-quote-demo [data-eligible="true"] [data-quote-status] { color: var(--sea); }
.sale-quote-demo .quote-result { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; padding-top: 22px; margin-top: 22px; border-top: 1px solid var(--line); }
.sale-quote-demo [data-quote-result] { font: 700 clamp(23px, 4vw, 30px) "Outfit", sans-serif; }
.sale-quote-demo .quote-note { margin: 18px 0 0; font-size: 13px; color: var(--muted); }