.report-topbar .report-nav {
  justify-content: center;
}

.report-page {
  padding-top: 5.5rem;
}

.report-hero {
  display: grid;
  gap: 1rem;
  padding: clamp(1.1rem, 2.5vw, 2rem);
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 24px;
  background:
    radial-gradient(circle at 90% 12%, rgba(250, 204, 21, .13), transparent 32%),
    radial-gradient(circle at 12% 20%, rgba(56, 189, 248, .17), transparent 30%),
    linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(30, 41, 59, .9));
  box-shadow: 0 20px 60px rgba(2, 8, 23, .28);
}

.report-hero h1 {
  margin-bottom: .6rem;
}

.report-section {
  padding-top: 1.2rem;
}

.report-form {
  display: grid;
  gap: 1rem;
}

.report-card {
  padding: clamp(1rem, 2.5vw, 1.35rem);
}

.drognostics-logo-card {
  display: inline-flex;
  align-items: center;
  max-width: min(520px, 100%);
  margin-bottom: 1.1rem;
}

.drognostics-product-logo {
  display: block;
  width: min(500px, 100%);
  height: auto;
}

.report-form input,
.report-form select,
.report-form textarea {
  width: 100%;
}

.report-login-page .report-hero {
  max-width: 720px;
}

.login-section {
  max-width: 720px;
  margin-inline: auto;
}

.login-form {
  max-width: 540px;
  margin-inline: auto;
}

.login-card h2 {
  margin: .45rem 0 .9rem;
}

.login-card {
  background:
    radial-gradient(circle at top right, rgba(250, 204, 21, .08), transparent 32%),
    var(--card);
}

.report-error {
  border: 1px solid rgba(248, 113, 113, .38);
  background: rgba(248, 113, 113, .12);
  color: #fecaca;
  border-radius: 14px;
  padding: .8rem .9rem;
  margin: .75rem 0 1rem;
  font-weight: 650;
}

.login-note {
  margin-top: .9rem;
}

@media (max-width: 720px) {
  .report-page {
    padding-top: 4.85rem;
  }
}