.purchase-section,
.legal-section,
.commerce-main {
  background: var(--color-paper);
}

.purchase-grid,
.order-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: var(--space-8);
  align-items: start;
}

.purchase-summary,
.purchase-panel,
.order-card,
.result-card,
.admin-card {
  border-top: 1px solid var(--color-line-light);
  border-bottom: 1px solid var(--color-line-light);
  padding-block: var(--space-5);
}

.purchase-name,
.order-card h2,
.result-card h1,
.admin-card h1 {
  margin: 0 0 var(--space-3);
  font-size: var(--type-subsection);
  line-height: 1.18;
  letter-spacing: -0.035em;
  word-break: keep-all;
}

.purchase-description,
.form-note,
.status-message {
  margin: 0;
  color: var(--color-muted-light);
  word-break: keep-all;
}

.purchase-price {
  margin: var(--space-5) 0 0;
  font-family: var(--font-serif);
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 1;
}

.option-stack,
.order-form,
.form-section,
.result-details,
.admin-form {
  display: grid;
  gap: var(--space-4);
}

.option-field,
.form-field,
.consent-field {
  display: grid;
  gap: var(--space-1);
}

.option-field > span,
.form-field > span,
.field-label,
.consent-field span {
  font-size: var(--type-label);
  font-weight: 700;
  letter-spacing: 0.02em;
}

.option-field select,
.option-field input,
.form-field input,
.form-field select,
.form-field textarea,
.admin-form input {
  width: 100%;
  min-height: 2.75rem;
  border: 1px solid var(--color-line-light);
  border-radius: var(--radius-small);
  background: var(--color-paper);
  color: var(--color-ink);
  font: inherit;
  padding: var(--space-2) var(--space-3);
}

.form-field textarea {
  min-height: 6.5rem;
  resize: vertical;
}

.primary-action,
.secondary-action,
.postcode-action {
  min-height: 3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-ink);
  border-radius: var(--radius-pill);
  padding: var(--space-2) var(--space-4);
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color var(--motion-fast) var(--ease-out),
    color var(--motion-fast) var(--ease-out);
}

.primary-action {
  background: var(--color-ink);
  color: var(--color-white);
}

.secondary-action,
.postcode-action {
  background: transparent;
  color: var(--color-ink);
}

.primary-action:hover,
.secondary-action:hover,
.postcode-action:hover {
  background: var(--color-charcoal);
  color: var(--color-white);
}

.primary-action:disabled {
  cursor: wait;
  opacity: 0.55;
}

.commerce-main {
  min-height: 70svh;
  padding: var(--section-space) var(--gutter);
}

.commerce-inner,
.legal {
  width: min(100%, var(--content-width));
  margin-inline: auto;
}

.commerce-header {
  max-width: 52rem;
  margin-bottom: var(--space-8);
}

.commerce-title,
.legal h1 {
  margin: 0 0 var(--space-3);
  font-size: clamp(2.1rem, 5.2vw, 5.5rem);
  line-height: 1.02;
  letter-spacing: -0.055em;
  word-break: keep-all;
}

.form-section {
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--color-line-light);
}

fieldset.form-section {
  min-width: 0;
  margin: 0;
  padding-inline: 0;
  border: 0;
  border-bottom: 1px solid var(--color-line-light);
}

.form-section legend {
  padding: 0;
  margin-bottom: var(--space-4);
  font-size: var(--type-subsection);
  font-weight: 700;
  letter-spacing: -0.035em;
}

.field-pair,
.postcode-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
}

.postcode-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.consent-field {
  grid-template-columns: auto 1fr;
  align-items: start;
}

.consent-field input {
  width: 1.25rem;
  height: 1.25rem;
  margin: 0.15rem 0 0;
}

.order-lines,
.result-lines {
  margin: 0;
}

.order-lines > div,
.result-lines > div {
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
  padding-block: var(--space-2);
  border-bottom: 1px solid var(--color-line-light);
}

.order-lines dt,
.result-lines dt {
  color: var(--color-muted-light);
}

.order-lines dd,
.result-lines dd {
  margin: 0;
  text-align: right;
  word-break: keep-all;
}

.order-total {
  font-weight: 800;
}

.payment-frame {
  margin-top: var(--space-5);
  border-top: 1px solid var(--color-line-light);
}

.form-error {
  min-height: 1.65em;
  margin: 0;
  color: var(--color-focus);
  font-weight: 650;
  word-break: keep-all;
}

.admin-table-wrap {
  overflow-x: auto;
  margin-top: var(--space-5);
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 64rem;
}

.admin-table th,
.admin-table td {
  padding: var(--space-2);
  border-bottom: 1px solid var(--color-line-light);
  text-align: left;
  vertical-align: top;
  font-size: 0.82rem;
}

@media (max-width: 760px) {
  .purchase-grid,
  .order-layout,
  .field-pair {
    grid-template-columns: 1fr;
  }
}