@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap");

:root {
  --color-primary: #0d47a1;
  --color-secondary: #37474f;
  --color-tertiary: #f57c00;
  --color-neutral: #f8f9fa;
  --border-radius: 12px;
}

html,
body {
  height: 100%;
  margin: 0;
}

body {
  font-family: "Inter", sans-serif;
  background-color: #fcfcfc;
  color: var(--color-secondary);
}

.hero-section {
  background:
    linear-gradient(
      135deg,
      rgba(13, 71, 161, 0.85) 50%,
      rgba(13, 71, 161, 0.6) 100%
    ),
    url("../img/hero-bg.jpg") no-repeat center center;
  background-size: cover;
  background-position: center;
  color: white;

  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;

  margin-bottom: 0;
  border-radius: 0;
}

.form-page-active {
  background: var(--color-neutral);
  padding: 40px 0;
  flex-grow: 1;
}

.navbar {
  background-color: white;
}

.navbar-brand.text-primary {
  color: var(--color-primary) !important;
}

footer {
  background-color: white;
  border-top: 1px solid #dee2e6;
  color: var(--color-secondary);
}

footer .nav-link {
  color: var(--color-secondary) !important;
}

footer .nav-link:hover {
  color: var(--color-primary) !important;
}

.text-tertiary {
  color: var(--color-tertiary) !important;
}
.bg-primary {
  background-color: var(--color-primary) !important;
}
.btn-primary {
  background-color: var(--color-primary);
  border: none;
}