.address-fields{display:grid;gap:17px}
#formAddressFields[hidden],
#formCompanyField[hidden],
#formQuantityField[hidden],
#formIntro[hidden],
#formPaymentNote[hidden],
#postalCodeField[hidden]{display:none!important}
.detail-form-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}

/* Commercial enquiries follow the reference site's restrained contact-page rhythm. */
.quote-dialog.is-commercial{
  width:min(920px,calc(100vw - 48px));
  height:auto;
  max-height:calc(100svh - 48px);
  padding:42px 64px 46px;
  overflow:auto;
  border-radius:12px;
}
.quote-dialog.is-commercial[open]{display:block}
.quote-dialog.is-commercial .dialog-close{right:22px;top:12px}
.quote-dialog.is-commercial .quote-copy{
  width:min(650px,100%);
  margin:0 auto 30px;
  text-align:center;
}
.quote-dialog.is-commercial .quote-copy h2{
  margin:0;
  font:600 clamp(32px,3.5vw,40px)/1.08 var(--sans);
  letter-spacing:-.035em;
}
.quote-dialog.is-commercial .quote-copy>p:last-child{
  margin:12px auto 0;
  max-width:600px;
  color:#666;
  font-size:14px;
  line-height:1.7;
}
.quote-dialog.is-commercial form{
  width:min(760px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 28px;
}
.quote-dialog.is-commercial form>.form-pair,
.quote-dialog.is-commercial form>label:has(textarea),
.quote-dialog.is-commercial form>.checkout-btn,
.quote-dialog.is-commercial form>.form-note{grid-column:1/-1}
.quote-dialog.is-commercial label{
  font-size:10px;
  font-weight:600;
  letter-spacing:.08em;
}
.quote-dialog.is-commercial input,
.quote-dialog.is-commercial select,
.quote-dialog.is-commercial textarea{
  margin-top:7px;
  padding:9px 0 11px;
  font-size:15px;
  line-height:1.45;
}
.quote-dialog.is-commercial textarea{
  height:68px;
}
.quote-dialog.is-commercial .checkout-btn{
  min-height:52px;
  margin-top:2px;
}

.quote-dialog.is-retail{
  width:min(980px,calc(100vw - 48px));
  height:fit-content;
  max-height:calc(100svh - 36px);
  padding:34px 58px 38px;
  overflow:auto;
  border-radius:12px;
}
.quote-dialog.is-retail[open]{display:block}
.quote-dialog.is-retail .dialog-close{right:22px;top:12px}
.quote-dialog .dialog-close:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
.quote-dialog.is-retail .quote-copy{
  width:min(680px,100%);
  margin:0 auto 24px;
  text-align:center;
}
.quote-dialog.is-retail .quote-copy h2{
  margin:0;
  font:600 clamp(31px,3.2vw,38px)/1.1 var(--sans);
  letter-spacing:-.035em;
}
.quote-dialog.is-retail form{
  width:min(820px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px 26px;
}
.quote-dialog.is-retail form>.form-pair:first-child,
.quote-dialog.is-retail #formAddressFields,
.quote-dialog.is-retail form>label:has(textarea),
.quote-dialog.is-retail form>.checkout-btn,
.quote-dialog.is-retail form>.form-note{grid-column:1/-1}
.quote-dialog.is-retail form>.form-pair:nth-of-type(2){
  grid-column:2;
  grid-row:2;
  grid-template-columns:1fr;
}
.quote-dialog.is-retail label{
  font-size:9px;
  font-weight:600;
  letter-spacing:.08em;
}
.quote-dialog.is-retail input,
.quote-dialog.is-retail select,
.quote-dialog.is-retail textarea{
  margin-top:6px;
  padding:8px 0 10px;
  font-size:14px;
  line-height:1.4;
}
.quote-dialog.is-retail textarea{height:54px}
.quote-dialog.is-retail #formAddressFields{
  grid-template-columns:1fr 1fr;
  gap:13px 26px;
}
.quote-dialog.is-retail #formAddressFields>.form-pair,
.quote-dialog.is-retail #formAddressFields>label:first-of-type{grid-column:1/-1}
.quote-dialog.is-retail .checkout-btn{min-height:52px;margin-top:2px}
.quote-dialog input:-webkit-autofill,
.quote-dialog input:-webkit-autofill:hover,
.quote-dialog input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--ink);
  box-shadow:0 0 0 1000px #fff inset;
  transition:background-color 9999s ease-out 0s;
}

@media(max-width:600px){
  .detail-form-pair{grid-template-columns:1fr}
  .quote-dialog.is-commercial{
    width:100vw;
    min-height:100svh;
    max-height:100svh;
    padding:58px 22px 34px;
    border-radius:0;
  }
  .quote-dialog.is-commercial .quote-copy{margin-bottom:34px;text-align:left}
  .quote-dialog.is-commercial .quote-copy h2{font-size:34px}
  .quote-dialog.is-commercial form{grid-template-columns:1fr}
  .quote-dialog.is-commercial form>label{grid-column:1}
  .quote-dialog.is-commercial .form-pair{grid-template-columns:1fr;gap:22px}
  .quote-dialog.is-retail{
    width:100vw;
    height:auto;
    min-height:100svh;
    max-height:100svh;
    padding:54px 22px 32px;
    border-radius:0;
  }
  .quote-dialog.is-retail .quote-copy{margin-bottom:28px;text-align:left}
  .quote-dialog.is-retail .quote-copy h2{font-size:32px}
  .quote-dialog.is-retail form,
  .quote-dialog.is-retail #formAddressFields{grid-template-columns:1fr}
  .quote-dialog.is-retail form>* ,
  .quote-dialog.is-retail form>.form-pair:nth-of-type(2),
  .quote-dialog.is-retail #formAddressFields>*{grid-column:1;grid-row:auto}
  .quote-dialog.is-retail .form-pair{grid-template-columns:1fr;gap:18px}
}