/* The commission follows the paper report: a silver workspace and one orange action. */
#pricing {
  background: #d8dcdd;
  color: var(--ink);
  border: 0;
  padding-block: clamp(36px, 4.5svh, 56px);
}
#pricing .pricing-layout {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  align-items: start;
  gap: clamp(30px, 4vw, 64px);
}
#pricing .pricing-copy { min-width: 0; }
#pricing .pricing-copy h2 {
  max-width: 13ch;
  font: 650 clamp(32px, 3.25vw, 54px)/1.1 var(--display);
  letter-spacing: -.035em;
  text-wrap: balance;
}
#pricing .pricing-copy .section-intro {
  max-width: 43ch;
  margin-top: 20px;
  font-size: 18px;
  line-height: 1.45;
}
#pricing .pricing-copy h3 {
  max-width: 34ch;
  margin-top: 26px;
  font: 650 19px/1.35 var(--body);
}
#pricing .scope-rows {
  counter-reset: preparation;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 16px 0 0;
}
#pricing .scope-rows > div {
  counter-increment: preparation;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  column-gap: 9px;
  padding-block: 12px;
  border-top: 1px solid #afb5b6;
}
#pricing .scope-rows > div::before {
  content: counter(preparation, decimal-leading-zero);
  grid-column: 1;
  grid-row: 1 / 3;
  padding-top: 3px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
}
#pricing .scope-rows dt {
  grid-column: 2;
  font: 650 17px/1.35 var(--body);
}
#pricing .scope-rows dd {
  grid-column: 2;
  max-width: 43ch;
  margin: 4px 0 0;
  font-size: 16px;
  line-height: 1.4;
}
#pricing .pricing-note {
  max-width: 49ch;
  margin-top: 18px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.45;
}
#pricing .contact-card {
  min-width: 0;
  background: #fafbf9;
  color: var(--ink);
  padding: 28px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  scroll-margin-top: 24px;
}
#pricing .contact-card > h3 {
  margin: 0 0 20px;
  font: 600 25px/1.25 var(--display);
  letter-spacing: -.03em;
}
#pricing .contact-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px 16px;
}
#pricing .field { gap: 7px; min-width: 0; }
#pricing .field:not(.field-wide) { grid-column: auto; }
#pricing .field-wide,
#pricing .legal-consent,
#pricing .form-legal,
#pricing .form-submit,
#pricing .form-hint,
#pricing .form-status { grid-column: 1 / -1; }
#pricing .field label { font-size: 14px; line-height: 1.35; }
#pricing .field input,
#pricing .field textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px 13px;
  background: #eeefed;
  color: var(--ink);
  border: 1px solid #74797d;
  border-radius: 4px;
  font: 400 16px/1.4 var(--body);
  caret-color: var(--ink);
}
#pricing .field textarea { min-height: 92px; resize: vertical; }
#pricing .field input::placeholder,
#pricing .field textarea::placeholder { color: var(--muted); opacity: 1; }
#pricing :focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
#pricing .field input:focus,
#pricing .field textarea:focus { border-color: var(--ink); }
#pricing .legal-consent {
  gap: 10px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.4;
}
#pricing .legal-consent input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--orange);
}
#pricing .legal-consent a,
#pricing .form-legal a { text-underline-offset: 2px; }
#pricing .form-legal {
  margin-top: -7px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}
#pricing .form-submit {
  min-height: 48px;
  margin-top: 0;
  padding: 12px 16px;
  background: var(--orange);
  color: var(--ink);
}
#pricing .form-submit:disabled { opacity: .65; cursor: wait; }
#pricing .form-hint {
  margin-top: -5px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
#pricing .form-status { font-size: 14px; line-height: 1.45; }
#pricing .form-status.is-error { color: #9d2d11; }
#pricing .form-status.is-success { color: var(--ink); }
#pricing ::selection { background: var(--ink); color: #fafbf9; }
@media (hover: hover) {
  #pricing .field input:hover,
  #pricing .field textarea:hover { border-color: var(--ink); }
  #pricing .form-submit:not(:disabled):hover { background: var(--orange-hover); }
}
@media (min-width: 851px) and (max-height: 800px) {
  #pricing { padding-block: 32px; }
  #pricing .pricing-copy h2 { font-size: clamp(32px, 3vw, 44px); }
  #pricing .pricing-copy .section-intro { margin-top: 18px; font-size: 17px; }
  #pricing .pricing-copy h3 { margin-top: 22px; font-size: 18px; }
  #pricing .scope-rows { margin-top: 14px; }
  #pricing .scope-rows > div { padding-block: 10px; }
  #pricing .contact-card { padding: 26px; }
  #pricing .contact-card > h3 { margin-bottom: 18px; font-size: 24px; }
  #pricing .contact-form { gap: 12px 14px; }
}
@media (max-width: 850px) {
  #pricing .pricing-layout { grid-template-columns: 1fr; gap: 28px; }
  #pricing .pricing-copy h2 { font-size: clamp(32px, 5vw, 44px); }
  #pricing .pricing-copy .section-intro { max-width: 58ch; }
  #pricing .scope-rows { max-width: 58ch; }
  #pricing .pricing-note { max-width: 58ch; }
}
@media (max-width: 560px) {
  #pricing { padding-block: 32px; }
  #pricing .pricing-layout { gap: 26px; }
  #pricing .pricing-copy h2 { font-size: clamp(28px, 7.2vw, 36px); }
  #pricing .pricing-copy .section-intro { margin-top: 18px; font-size: 17px; }
  #pricing .pricing-copy h3 { margin-top: 24px; font-size: 18px; }
  #pricing .scope-rows > div { grid-template-columns: 27px minmax(0, 1fr); }
  #pricing .contact-card { padding: 24px 20px; }
  #pricing .contact-card > h3 { font-size: 23px; line-height: 1.3; }
  #pricing .contact-form { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #pricing .field:not(.field-wide) { grid-column: 1 / -1; }
  #pricing .form-submit { font-size: 16px; }
}
