html,
body {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

.login-shell,
.login-shell .authentication-inner {
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
}

.login-shell .authentication-inner {
  flex-wrap: nowrap;
}

/* === Hero sizing =========================================== */
.login-hero {
  padding: 3.5rem 4rem;
}

.login-hero__content {
  max-width: 39rem;
  justify-content: center;
  gap: 1.5rem;
}

.login-hero__logo {
  width: min(16rem, 100%);
}

.login-hero__title {
  max-width: 32rem;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.02;
}

.login-hero__lead {
  max-width: 31rem;
  font-size: 0.96rem;
  line-height: 1.58;
}

/* === Proof cards =========================================== */
.login-proof-card {
  padding: 1rem;
  border-radius: 1rem;
}

.login-proof-card p {
  font-size: 0.82rem;
  line-height: 1.45;
}

.login-proof-card__icon {
  width: 2.3rem;
  height: 2.3rem;
  margin-bottom: 0.75rem;
  font-size: 1rem;
}

/* === Metric strip ========================================== */
.login-metric-strip {
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-radius: 1.15rem;
}

.login-metric__value { font-size: 1rem; }
.login-metric__label { font-size: 0.76rem; }

/* === Form panel sizing ===================================== */
.login-panel {
  max-width: 25.5rem;
  /* top padding slightly more to accommodate the ::before gold rule */
  padding: 2rem 1.85rem 1.85rem;
  border-radius: 1.45rem;
}

.login-panel__logo {
  width: min(12rem, 100%);
}

/* === Mobile banner ========================================= */
.login-mobile-banner,
.login-support-card {
  padding: 0.9rem 1rem;
  border-radius: 1rem;
}

/* === Alert inside panel ==================================== */
.login-panel .alert {
  margin-bottom: 0.9rem;
  padding: 0.75rem 0.9rem;
}

/* === Input sizing ========================================== */
.login-field .form-control {
  min-height: 3rem;
}

/* === Submit sizing ========================================= */
.login-submit {
  min-height: 3.15rem;
}

/* === Responsive ============================================ */
@media (max-width: 991.98px) {
  html,
  body {
    overflow: hidden;
  }

  .login-shell,
  .login-shell .authentication-inner {
    height: 100dvh;
    min-height: 100dvh;
  }

  .login-panel {
    max-width: 24rem;
    padding: 1.85rem 1.5rem 1.5rem;
  }
}

@media (max-height: 860px) and (min-width: 992px) {
  .login-hero {
    padding: 2rem 2.5rem;
  }

  .login-hero__content {
    gap: 1.1rem;
  }

  .login-hero__logo {
    width: min(14rem, 100%);
  }

  .login-hero__title {
    font-size: clamp(1.8rem, 2.5vw, 2.6rem);
  }

  .login-hero__lead {
    font-size: 0.9rem;
    line-height: 1.5;
  }

  .login-proof-card {
    padding: 0.85rem;
  }

  .login-proof-card p {
    font-size: 0.78rem;
  }

  .login-panel {
    padding: 1.75rem 1.5rem 1.5rem;
  }
}

@media (max-height: 760px) {
  .login-panel .card-body {
    zoom: 0.96;
  }
}