@media (min-width: 1441px) {
  .logo-small {
    left: calc((100vw - 1286px) / 2);
  }

  .change-access {
    right: calc((100vw - 1196px) / 2);
  }
}

@media (max-width: 1440px) {
  .img-logo {
    width: clamp(100px, 19vw, 274px);
    height: clamp(122px, 24vw, 335px);
  }

  .logo-small {
    width: clamp(64px, 9vw, 100px);
    height: clamp(78px, 11vw, 122px);
    top: clamp(37px, 5vw, 80px);
    left: clamp(38px, 5vw, 77px);
    transform: none;
  }

  .access-window {
    padding-block: clamp(28px, 5vw, 48px);
    padding-inline: clamp(16px, 8vw, 115px);
    border-radius: 30px;
    box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.04);
  }

  .window-login {
    width: clamp(285px, 90vw, 652px);
  }

  .window-signup {
    width: clamp(285px, 90vw, 598px);
    margin-left: clamp(0px, 18vw, 60px);
  }
}

@media (max-width: 888px) {
  .change-access {
    right: clamp(0px, 9vw, 122px);
  }
}

@media (max-width: 777px) {
  input {
    padding-right: 48px;
  }

  .logo-container {
    background-color: rgb(42, 54, 71);
  }

  .logo-small {
    width: clamp(48px, 9vw, 64px);
    height: clamp(59px, 11vw, 78px);
    top: clamp(8px, 5vw, 37px);
    left: clamp(8px, 5vw, 38px);
  }

  .window-signup {
    width: clamp(285px, 90vw, 598px);
    margin-left: 0px;
    margin-top: clamp(0px, 9vw, 80px);
  }

  .change-access {
    width: clamp(243px, 64vw, 350px);
    height: clamp(40px, 5vw, 48px);
    font-size: clamp(16px, 3vw, 20px);
    top: auto;
    bottom: 64px;
    right: auto;
  }

  .change-access button {
    font-size: clamp(16px, 3vw, 20px);
  }

  .legal {
    bottom: 24px;
  }

  .access-window {
    gap: clamp(24px, 8vw, 32px);
  }

  .access-headline {
    gap: clamp(10px, 3vw, 16px);
  }

  .content-area {
    gap: clamp(12px, 3vw, 16px);
  }

  .top12-right21 {
    top: 10px;
    right: 16px;
  }

  .input-space-login {
    gap: clamp(16px, 5vw, 32px);
  }

  .input-space-login input {
    height: clamp(40px, 7vw, 48px);
    font-size: clamp(16px, 5vw, 20px);
  }

  .input-space-signup {
    gap: clamp(16px, 5vw, 24px);
  }

  .input-space-signup input {
    height: clamp(40px, 7vw, 48px);
    font-size: clamp(16px, 5vw, 20px);
  }

  .login-buttons {
    width: auto;
    height: auto;
    flex-direction: column;
    justify-content: center;
    gap: clamp(8px, 3vw, 21px);
  }

  .access-button {
    width: clamp(140px, 25vw, 180px);
    height: clamp(40px, 7vw, 51px);
  }

  .access-button button {
    width: 100%;
    font-size: clamp(16px, 3vw, 20px);
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .arrow {
    top: clamp(12px, 7vw, 54px);
    left: clamp(16px, 6vw, 48px);
  }

  .signup-btn {
    height: clamp(40px, 7vw, 48px);
    font-size: clamp(16px, 3vw, 20px);
  }
}

@media (max-width: 428px) {
  h1 {
    font-size: clamp(32px, 11vw, 47px);
  }

  .blue-line {
    width: clamp(110px, 35vw, 150px);
  }
}
