/* Contact (kontak.html): page-local styles on top of kit/kit.css */

.page-hero__foot .hero-copy { grid-column: 1 / 7; }
.hero-pills { margin-top: 28px; }

/* ---- (01) what happens next */
.next__intro { margin: -40px 0 clamp(56px, 6vw, 88px); color: var(--muted); }
#next .h2 { margin-bottom: 72px; }
.steps .row__n { display: flex; flex-direction: column; gap: 6px; }
.steps .row__n .label { font-size: 11px; }
.look { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); column-gap: var(--gap); align-items: start; margin-top: clamp(104px, 10vw, 160px); }
.look__txt { grid-column: 1 / 5; }
.look__h { margin: 14px 0 20px; }
.look__pills { margin-top: 28px; }
.look__fig { grid-column: 5 / 11; margin-top: 42px; }

/* ---- (02) the form: the line runs down the left margin and ends in the submit button */
.form-sec .h2 { margin-bottom: 28px; }
.form__help { color: var(--muted); margin-bottom: clamp(56px, 6vw, 88px); }
.form { align-self: start; scroll-margin-top: calc(var(--nav-h) + 200px); }
.field__opt { margin-left: 8px; color: var(--faint); }
.form-context { grid-column: 1 / -1; border-left: 2px solid var(--accent); padding: 4px 0 4px 16px; font-size: 16px; line-height: 1.5; }
.form .form__end { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 16px; padding-top: 72px; }
.form__status { font-size: 15px; line-height: 1.5; color: var(--accent); max-width: 34em; }
.form__status:empty { display: none; }
.btn-receive[type="submit"] { font-family: var(--f-sans); }

.form-aside { align-self: start; border-top: 1px solid var(--ink); }
.form-aside__blk { padding: 22px 0 30px; border-bottom: 1px solid var(--hair); }
.form-aside__blk > p:not(.label) { font-size: 16px; line-height: 1.5; color: #2F2D29; margin-top: 12px; }
.form-aside__h { font-weight: 500; font-size: 21px; line-height: 1.2; letter-spacing: -.02em; margin-top: 12px; }
.form-aside .link { margin-top: 16px; }
.form-aside__list { margin-top: 14px; }
.form-aside__list li { position: relative; padding: 8px 0 8px 20px; font-size: 15px; line-height: 1.45; border-top: 1px solid var(--hair); }
.form-aside__list li::before { content: ""; position: absolute; left: 2px; top: 16px; width: 6px; height: 6px; border-radius: 50%; border: 1.5px solid var(--accent); }

@media (max-width: 1100px) {
  .form { grid-column: 2 / 9; }
  .form-aside { grid-column: 9 / 13; }
}
@media (max-width: 1000px) {
  .form { grid-column: 2 / 12; }
  .form-aside { grid-column: 2 / 12; margin-top: 88px; }
  .look { display: block; }
  .look__fig { margin-top: 56px; }
}
@media (max-width: 760px) {
  .page-hero__foot .hero-copy { padding-left: 0; }
  .next__intro { margin: -16px 0 40px; }
  #next .h2 { margin-bottom: 40px; }
  .steps .row__n { flex-direction: row; gap: 10px; margin-bottom: 8px; }
  .look { margin-top: 72px; }
  .form__help { margin-bottom: 40px; }
  .form .form__end { padding-top: 40px; }
  .form .btn--xl { width: 100%; }
  .form-aside { margin-top: 72px; }
}