.btn-order {
  position: relative;
  display: inline-block;
  background: var(--ember-dark);
  color: var(--ember-hi);
  border: 0.125em solid transparent;
  border-radius: 0.625em;
  padding: 0.8em 1.7em;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-align: center;
  cursor: pointer;
  background-image: linear-gradient(var(--ember-dark), var(--ember-dark)), linear-gradient(135deg, #e0552f, #ff8a5c);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  transition: color 0.3s ease, box-shadow 0.3s ease;
}

.btn-order:hover,
.btn-order:focus-visible {
  color: var(--paper);
  text-decoration: none;
  box-shadow: 0 0.5em 1.6em rgba(224, 85, 47, 0.32);
}

.btn-order-wide {
  width: 100%;
  font-size: 1.08em;
  padding: 0.95em 1.7em;
}

.btn-quiet {
  display: inline-block;
  color: var(--mute);
  border-bottom: 0.0625em solid var(--line);
  padding-bottom: 0.2em;
  transition: color 0.3s ease, border-color 0.3s ease;
}

.btn-quiet:hover {
  color: var(--paper);
  border-color: var(--ember);
  text-decoration: none;
}

.badge {
  display: inline-block;
  background: var(--slab);
  border: 0.0625em solid var(--line);
  border-radius: 999px;
  padding: 0.38em 0.95em;
  font-size: 0.84em;
  color: var(--mute);
  letter-spacing: 0.02em;
}

.badge-lit {
  border-color: rgba(224, 85, 47, 0.55);
  color: var(--ember-hi);
}

.eyebrow {
  display: block;
  font-size: 0.8em;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ember);
  margin-bottom: var(--s1);
}

.lede {
  font-size: var(--fluid-lede);
  color: var(--mute);
  max-width: 34em;
}

.fine {
  font-size: 0.86em;
  color: var(--dim);
  line-height: 1.65;
}

.price-was {
  font-size: 1.1em;
  color: var(--dim);
  text-decoration: line-through;
}

.price-now {
  font-family: Bitter, Georgia, serif;
  font-size: 2.2em;
  font-weight: 700;
  color: var(--paper);
  line-height: 1;
}

.price-off {
  background: var(--ember);
  color: var(--paper);
  border-radius: 0.3em;
  padding: 0.3em 0.6em;
  font-size: 0.82em;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.form-label {
  display: block;
  font-size: 0.86em;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 0.4em;
}

.form-input {
  width: 100%;
  background: #101114;
  color: var(--paper);
  border: 0.0625em solid var(--line);
  border-radius: 0.5em;
  padding: 0.78em 0.9em;
  font: inherit;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.form-input::placeholder {
  color: #6d727a;
}

.form-input:focus {
  outline: none;
  border-color: var(--ember);
  box-shadow: 0 0 0 0.2em rgba(224, 85, 47, 0.18);
}

.form-input.is-error {
  border-color: #ff6b6b;
}

.form-error {
  display: block;
  color: #ff9d9d;
  font-size: 0.84em;
  margin-top: 0.35em;
}

.faq-pill {
  border: 0.0625em solid var(--line);
  border-radius: 999px;
  padding: 0.5em 1.1em;
  background: var(--slab);
  color: var(--mute);
  cursor: pointer;
  transition: color 0.3s ease, border-color 0.3s ease;
}

.faq-pill:hover {
  color: var(--paper);
  border-color: var(--ember);
}

.faq-pill.is-active {
  background: var(--ember);
  color: var(--paper);
  border-color: transparent;
}