/* Override Bootstrap styles for dark theme and video background */
.hero {
  position: relative;
  width: 100%;
  height: 100vh;
}

.video-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.55);
  z-index: 0;
}

.hero .container {
  z-index: 1;
  position: relative;
}

.contact-section {
  background-color: #1a1a1a;
}

.contact-form {
  max-width: 600px;
  margin: auto;
}

.contact-form input,
.contact-form textarea {
  background-color: #222;
  color: white;
  border: 1px solid #444;
}

.contact-form button {
  background-color: #007BFF;
  border: none;
  color: white;
  font-weight: bold;
  transition: background-color 0.3s ease;
}

.contact-form button:hover {
  background-color: #0056b3;
}

/* Honeypot: kept in the layout flow (not display:none) so DOM-diffing bots
   still see and fill it, but positioned off-screen so real users never do. */
.hp-field {
  position: absolute;
  left: -9999px;
  top: -9999px;
}