.quote-layout {
  display: grid;
  min-height: 100vh;
  padding-top: 74px;
  grid-template-columns: minmax(340px,37vw) 1fr;
}
.quote-aside {
  position: sticky;
  top: 74px;
  display: flex;
  height: calc(100vh - 74px);
  padding: clamp(2.5rem,5vw,5rem);
  flex-direction: column;
  justify-content: space-between;
  background: var(--ink);
  color: #fff;
}
.quote-aside h1 {
  max-width: 11ch;
  margin: 0 0 1.5rem;
  font-family: var(--display);
  font-size: clamp(2.5rem,4.4vw,4.6rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .98;
}
.quote-aside > div > p:last-child { max-width: 38ch; color: #aeb9c9; line-height: 1.6; }
.quote-panel {
  display: grid;
  min-width: 0;
  padding: clamp(2.5rem,6vw,6rem);
  place-items: start center;
  background: var(--paper);
}
#quote-form { width: min(100%,760px); }
#quote-form > h2 {
  max-width: 14ch;
  margin: 0 0 2.8rem;
  font-family: var(--display);
  font-size: clamp(2.6rem,5vw,4.8rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .98;
}
.quote-group { padding: 1.7rem 0 2rem; border-top: 1px solid var(--line); }
.quote-group legend { float: left; width: 100%; margin: 0 0 1.2rem; font-family: var(--display); font-size: 1.15rem; }
.quote-group legend + * { clear: both; }
.quote-group .field-grid { margin-top: 0; }
.quote-group textarea { min-height: 145px; }
.quote-actions { margin-top: 1rem; }
.back-link { color: var(--muted); font-size: .9rem; text-decoration: none; }
.back-link:hover { color: var(--ink); }

@media (max-width:900px) {
  .quote-layout { grid-template-columns: 1fr; }
  .quote-aside { position: static; height: auto; padding: 3rem 1.5rem; }
  .quote-aside h1 { max-width: 14ch; font-size: clamp(2.6rem,8vw,4rem); }
  .quote-aside .aside-note { margin-top: 2rem; }
  .quote-panel { padding: 3rem 1.25rem 4rem; }
}
@media (max-width:600px) {
  .quote-layout { padding-top: 66px; }
  .quote-aside { padding: 2.5rem 1.25rem; }
  #quote-form > h2 { font-size: clamp(2.35rem,12vw,3.4rem); }
  .quote-group { padding: 1.4rem 0 1.7rem; }
  .quote-actions { align-items: stretch; flex-direction: column-reverse; }
  .quote-actions .primary-action { width: 100%; justify-content: space-between; }
  .back-link { padding: .8rem 0; text-align: center; }
}