/* Hero Section */
.hero {
  height: 85vh;
  min-height: 600px;
  position: relative;
  background-color: #000;
  /* Black background to prevent white flash */
}

.hero-poster,
.hero-video {
  background-color: #000;
  /* Ensure no white shows through */
}

.hero-poster img {
  background-color: #000;
  display: block;
  /* Remove any extra space */
}

/* Video */
.hero-video {
  z-index: 2;
  filter: brightness(0.5) saturate(1.15) contrast(1.1);
  /* Keep original filter */
  opacity: 0;
  transition: opacity 1s ease-in-out;
  background-color: #000;
}

/* Content */
.container {
  z-index: 3 !important;
}

/* Content tweaks */
.letter-spacing-wide {
  letter-spacing: 0.35em;
  font-size: 1.4rem;
}

.text-light-blue {
  color: #c3d9ff;
}

.text-gradient {
  background: linear-gradient(135deg, #0d6efd, #6f42c1);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.btn-outline-light {
  border-width: 2px;
  transition: all 0.35s ease;
}

.btn-outline-light:hover {
  background-color: #ffffff;
  color: #074e8c;
  border-color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(13, 110, 253, 0.35);
}

/* Responsive */
@media (max-width: 992px) {
  .hero {
    height: 75vh;
    min-height: 550px;
  }

  h1.display-4 {
    font-size: 3.2rem;
  }
}

@media (max-width: 768px) {
  .hero {
    height: 70vh;
    min-height: 500px;
  }

  h5.letter-spacing-wide {
    font-size: 1.1rem;
    letter-spacing: 0.25em;
  }

  .btn-lg {
    padding: 0.8rem 2.5rem;
    font-size: 1.1rem;
  }
}

@media (max-width: 576px) {
  h1.display-4 {
    font-size: 2.4rem;
    line-height: 1.3;
  }

  .hero-content {
    padding: 2rem 1rem;
  }
}