:root {
  --reco-green-0:   #033913;
  --reco-green-10:  #1a2a1c;
  --reco-green-20:  #2f3f28;
  --reco-green-30:  #445534;
  --reco-green-40:  #596a40;
  --reco-green-50:  #6e7f4c;
  --reco-green-60:  #839458;
  --reco-green-70:  #98a964;
  --reco-green-80:  #adbe70;
  --reco-green-90:  #c2d37c;
  --reco-green-100: #F5F5DC;
}

body {
  background-color: var(--reco-green-100);
  color: var(--reco-green-100);
  font-family: 'Poppins', sans-serif;
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.container {
  max-width: 800px;
  width: 100%;
  background: var(--reco-green-20);
  backdrop-filter: blur(10px);
  border: 1px solid var(--reco-green-40);
  border-radius: 12px;
  padding: 40px;
  text-align: center;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  margin: auto; /* center the card vertically */
}
h1 { color: var(--reco-green-100); margin-bottom: 30px; font-size: 28px; font-weight: 600; }
.btn-group { display: flex; flex-direction: column; gap: 15px; }
button {
  color: var(--reco-green-100); padding: 12px 25px; border: none; border-radius: 8px; cursor: pointer;
  font-size: 16px; font-weight: 600; width: 100%; max-width: 300px; margin: 0 auto; transition: background 0.3s ease;
}
button:hover { transform: translateY(-2px); }
.btn-recruiter, .btn-employee { background-color: var(--reco-green-50); }
.btn-recruiter:hover, .btn-employee:hover { background-color: var(--reco-green-60); }
/* footer */
footer {
  margin-top: 32px;
  padding: 20px 16px 40px;
  text-align: center;
  color: var(--reco-green-0);
  font-size: 14px;
}
.footer-line {
  height: 1px;
  background: var(--reco-green-20);
  max-width: 90%;
  margin: 0 auto 18px;
  opacity: 0.7;
}
.footer-links {
  display: flex; gap: 28px; justify-content: center; flex-wrap: wrap;
}
.footer-links a, .footer-links span {
  color: var(--reco-green-0); text-decoration: none; font-weight: 600;
}
.footer-links a:hover { text-decoration: underline; color: var(--reco-green-50); }
@media (max-width: 600px) {
  .container { padding: 24px; margin: 16px; }
  button { max-width: 100%; }
}