html {
   min-height: 100%;
   font-family: system-ui, Helvetica, sans-serif;
}

@media screen and (min-width: 768px) {
   html {
      font-weight: lighter;
   }
}

body,
h1,
h2,
h3,
li {
   margin: 0;
   padding: 0;
}

ol,
ul {
   margin: 0;
   padding-inline-start: 24px;
}

#root {
   position: relative;
}

html,
body,
#root {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
}

a {
   text-decoration: none;
}

button {
   border: none;
}

button:active,
button:focus {
   outline: none;
}

.form {
   background: #fff;
   padding: 48px;
   max-width: 440px;
   position: relative;
   z-index: 10;
   border-radius: 5px;
}

.form-caption {
   font-weight: bold;
   font-size: 42px;
   text-align: center;
   margin-bottom: 8px;
}

.form-description {
   text-align: center;
   font-size: 19px;
   line-height: 24px;
   margin-bottom: 32px;
}

.form-wrapper {
   position: relative;
   padding-bottom: 16px;
}

.form-policy {
   font-size: 14px;
   display: flex;
   align-items: center;
}

.form-policy-input {
   margin-right: 8px;
}

.form-input-antibot {
   opacity: 0.01;
   height: 1px;
   padding-bottom: 0;
}

.form-input {
   font-size: 16px;
   padding: 16px;
   display: block;
   width: 100%;
   border: none;
   border-bottom: 1px solid #ccc;
   box-sizing: border-box;
   background: inherit;
   border: 1px solid #ccc;
   border-radius: 5px;
}

.form-input::-moz-placeholder {
   color: #acacac;
}

.form-input::placeholder {
   color: #acacac;
}

.form-input:focus {
   outline: none;
}

.form-button {
   border-radius: 5px;
   font-weight: bold;
   text-align: center;
   cursor: pointer;
   display: inline-block;
   width: 100%;
   margin-top: 18px;
   padding: 20px 60px;
   font-size: 16px;
}

.form-close {
   color: #9c9c9c;
   font-weight: bold;
   font-size: 30px;
   align-items: center;
   justify-content: center;
   font-family: Helvetica;
   position: absolute;
   top: 12px;
   right: 16px;
   cursor: pointer;
}

@media (max-width: 640px) {
   .form {
      padding: 48px 32px;
   }

   .form-button {
      padding: 20px 42px;
      font-size: 14px;
   }

   .form-caption {
      font-size: 30px;
   }

   .form-description {
      font-size: 20px;
      line-height: 24px;
   }

   .form-policy {
      font-size: 12px;
   }
}

@media (max-width: 428px) {
   .form-caption {
      font-size: 24px;
   }

   .form-description {
      font-size: 14px;
      line-height: 18px;
   }
}

@media (max-width: 351px) {
   .form-caption {
      font-size: 22px;
   }
}