/* Background image across entire site */
.bg-image {
  position: fixed;
  top: 0; 
  left: 0; 
  width: 100vw; 
  height: 100vh;
  background-image: url('../images/02.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  background-size: cover;
  z-index: -1;
}


.header-overlay {
  background: rgba(10, 25, 40, 0.7);
  padding-bottom: 0.6rem;
}

.site-title {
  color: #439cd3;
  font-family: 'Segoe UI', 'Tahoma', 'Geneva', 'Verdana', sans-serif;
  font-size: 2.2rem;
  letter-spacing: 0.04em;
  font-weight: 600;
}

.site-subtitle {
  color: #fff;
  font-size: 1.08rem;
  letter-spacing: 0.08em;
}

.no-harm {
  color: #ffe294;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.navbar {
  background: transparent !important;
}

.navbar-nav .nav-link {
  color: #fff !important;
  font-size: 1.05rem;
  font-weight: 400;
  margin: 0 0.7rem;
}

.navbar-nav .nav-link.active,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link:hover {
  color: #ffe294 !important;
  font-weight: 600;
  text-decoration: underline;
}

.main-content {
  min-height: 67vh;
  position: relative;
}

.content-box {
  background: rgba(240, 240, 240, 0.92);
  border: 2px solid #555;
  border-radius: 7px;
  max-width: 820px;
  padding: 1.8rem 2rem 1.2rem 2rem;
  margin: 4rem auto 2rem auto;
  box-shadow: 0 8px 28px 6px rgba(50,65,80,0.09);
}

.about-text {
  color: #222;
  font-size: 1.02rem;
}

.footer {
  background: #222 !important;
  color: #bbb;
  font-size: 0.97rem;
}

/* Responsive: center vertically main content on large screen */
@media (min-width: 992px) {
  .main-content {
    min-height: 75vh;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}



/* остальные стили из первого ответа */