html, body {
      margin: 0;
      padding: 0;
      font-family: 'Segoe UI', sans-serif;
      background: linear-gradient(to right, #dfe9f3 0%, #ffffff 100%);
      height: 100vh;
    }

    .register-wrapper {
      display: flex;
      overflow: hidden;
    }

    .register-image {
      flex: 1;
      background: linear-gradient(to bottom right, rgba(0,0,0,0.6), rgba(0,0,0,0.4)),
                  url('https://assets-v2.lottiefiles.com/a/7ed64552-1180-11ee-a916-ab928951c9e0/YzDI1yWTq3.gif') no-repeat center center;
      background-size: cover;
    }

    .register-form {
      flex: 1;
      display: flex;
      align-items: centre;
      justify-content: centre;
      padding: 40px;
      background: rgba(255, 255, 255, 0.95);
      overflow-y: auto;
      margin-top: 10%;
    }

    .register-form-inner {
      max-width: 600px;
      width: 100%;
    }

    .form-section-title {
      font-weight: 600;
      font-size: 1.1rem;
      border-left: 4px solid #343a40;
      padding-left: 10px;
      margin-bottom: 20px;
      margin-top: 30px;
    }

    .form-control:focus {
      border-color: #343a40;
      box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.25);
    }

    .btn-dark {
      border-radius: 30px;
      font-weight: 600;
      transition: all 0.3s ease-in-out;
      
    }

    .btn-dark:hover {
      background-color: #000;
      transform: scale(1.05);
    }

    @media (max-width: 991.98px) {
      .register-wrapper {
        flex-direction: column;
      }

      .register-image {
        height: 250px;
        width: 100%;
      }

      .register-form {
        flex: none;
        padding: 30px 20px;
        height: auto;
        margin-top: 12%;
      }

      .register-form-inner {
        max-width: 100%;
      }

      h2 {
        font-size: 1.6rem;
      }

      .btn-dark {
        width: 100%;
      }
    }

    @media (max-width: 576px) {
      .register-form {
        padding: 20px 15px;
        margin-top: 12%;
      }

      h2 {
        font-size: 1.4rem;
      }

      .form-label,
      input,
      textarea {
        font-size: 0.95rem;
      }

      .form-section-title {
        font-size: 1rem;
      }

      .btn-dark {
        width: 100%;
        font-size: 1rem;
        
      }
    }


/* Already have an account?     */
/* =========================================== */



#login {
   color: rgb(12, 137, 142);
}