:root {
  --color-orange: #fe7201;
  --color-navy: #00305f;
}

.btn-primary {
  background-color: var(--color-orange) !important;
  border-color: var(--color-orange) !important;
}
.btn-primary:hover,
.btn:hover {
  border-color: var(--color-navy) !important;
  background-color: var(--color-navy) !important;
}
.text-primary {
  color: var(--color-orange) !important;
}
.bg-dark {
  background-color: var(--color-navy) !important;
}
.font-pacifico {
  font-family: "Pacifico", cursive;
}

.carousel-item {
  height: 600px;
  height: auto;
}

.carousel-caption {
  text-align: left;
  bottom: 50%;
  transform: translateY(50%);
  max-width: 750px;
  left: 5%;
}

.bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}

.service-card {
  transition: all 0.3s ease;
}

.service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.form-box {
  position: absolute;
  top: 50%;
  right: 50px;
  transform: translateY(-50%);
  width: 400px;
  background-color: rgba(255, 255, 255, 0.95);
  z-index: 100;
}

@media (max-width: 992px) {
  .form-box {
    position: static;
    transform: none;
    width: 100%;
    margin-top: 2rem;
  }

  .carousel-caption {
    bottom: 20%;
    transform: none;
    padding-bottom: 2rem;
  }
}
h2,
h3,
h4,
h5,
h6 {
  color: var(--color-navy);
}

a.btn:hover {
  color: #fff;
}
a {
  font-weight: bold;
  color: var(--color-orange);
}
.orange {
  color: var(--color-orange) !important;
}