body.modal-open{overflow:hidden}
button,input,textarea{font:inherit}
button{cursor:pointer}

.modal{
  position:fixed;
  inset:0;
  z-index:100;
  display:grid;
  place-items:center;
  padding:24px;
  opacity:0;
  visibility:hidden;
  transition:opacity .22s ease,visibility .22s ease;
}

.modal.is-open{
  opacity:1;
  visibility:visible;
}

.modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(7,31,53,.72);
  backdrop-filter:blur(5px);
}

.modal-window{
  position:relative;
  z-index:1;
  width:min(610px,100%);
  max-height:calc(100vh - 48px);
  overflow:auto;
  padding:42px;
  background:var(--paper);
  border:1px solid rgba(195,146,74,.48);
  box-shadow:0 30px 90px rgba(7,31,53,.35);
  transform:translateY(14px) scale(.985);
  transition:transform .22s ease;
}

.modal.is-open .modal-window{
  transform:translateY(0) scale(1);
}

.modal-window h2{
  margin:8px 48px 26px 0;
  font:38px/1.2 Prata,Georgia,serif;
  font-weight:400;
  color:var(--text);
}

.modal-close{
  position:absolute;
  top:14px;
  right:18px;
  width:42px;
  height:42px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--navy);
  font-size:34px;
  line-height:1;
}

.modal-close:hover{color:var(--gold)}

.consultation-form{
  display:grid;
  gap:18px;
}

.consultation-form label{
  display:grid;
  gap:7px;
  color:var(--text);
  font-size:14px;
  font-weight:600;
}

.consultation-form small{
  color:var(--muted);
  font-weight:400;
}

.consultation-form input,
.consultation-form textarea{
  width:100%;
  padding:13px 14px;
  border:1px solid rgba(16,42,67,.2);
  border-radius:0;
  background:#fff;
  color:var(--text);
  outline:none;
  transition:border-color .18s ease,box-shadow .18s ease;
}

.consultation-form textarea{
  min-height:130px;
  resize:vertical;
}

.consultation-form input:focus,
.consultation-form textarea:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(195,146,74,.12);
}

.consent{
  grid-template-columns:auto 1fr!important;
  align-items:start;
  gap:10px!important;
  color:var(--muted)!important;
  font-size:13px!important;
  font-weight:400!important;
}

.consent input{
  width:18px;
  height:18px;
  margin:1px 0 0;
  accent-color:var(--navy);
}

.form-status{
  min-height:22px;
  margin:0;
  text-align:center;
  color:var(--muted);
  font-size:13px;
}

@media(max-width:520px){
  .modal{padding:12px}
  .modal-window{
    max-height:calc(100vh - 24px);
    padding:30px 20px 24px;
  }
  .modal-window h2{font-size:30px}
}

.consent a{
  color:var(--navy);
  text-decoration:underline;
  text-decoration-color:rgba(195,146,74,.75);
  text-underline-offset:3px;
}

.consent a:hover{
  color:var(--gold);
}


/* Юридические документы поверх сайта */

.legal-modal-window{
  width:min(960px,100%);
  height:min(820px,calc(100vh - 48px));
  padding:0;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto 1fr;
}

.legal-modal-header{
  min-height:76px;
  padding:18px 72px 18px 28px;
  display:flex;
  align-items:center;
  border-bottom:1px solid rgba(16,42,67,.12);
  background:var(--paper);
}

.legal-modal-header h2{
  margin:0;
  font-size:25px;
}

.legal-modal-header .modal-close{
  top:16px;
}

.legal-frame{
  width:100%;
  height:100%;
  border:0;
  background:var(--cream);
}

.legal-open{
  cursor:pointer;
}

@media(max-width:520px){
  .legal-modal-window{
    height:calc(100vh - 24px);
  }

  .legal-modal-header{
    min-height:68px;
    padding:14px 58px 14px 18px;
  }

  .legal-modal-header h2{
    font-size:19px;
  }
}