/* Cargo to Africa overrides on top of the Blogy template */

.site-nav .logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}
.site-nav .logo-icon {
  width: 42px;
  height: 28px;
  /* SVG uses currentColor; as <img> it renders black, so invert to white for the dark nav */
  filter: brightness(0) invert(1);
}
.site-nav .logo-text {
  color: #fff !important;
  font-size: 22px;
  letter-spacing: -0.01em;
}

/* Rich text from Sanity */
.post-content-body h2 { font-size: 1.6rem; margin: 2rem 0 1rem; }
.post-content-body h3 { font-size: 1.3rem; margin: 1.5rem 0 .75rem; }
.post-content-body blockquote {
  border-left: 4px solid #214252;
  padding: .5rem 1rem;
  margin: 1.5rem 0;
  color: #555;
  font-style: italic;
}
.post-content-body img { max-width: 100%; height: auto; }
.post-content-body ul, .post-content-body ol { margin-bottom: 1rem; }

/* Template bug: the search icon is absolutely positioned but its form isn't a positioning context */
.sidebar-search-form { position: relative; }
.sidebar-search-form input { padding-right: 50px; }

.custom-pagination a,
.custom-pagination span { margin: 0 2px; }

/* Newsletter */
.site-nav .site-menu > li.nav-subscribe > a {
  background: #fff;
  color: #214252 !important;
  border-radius: 4px;
  padding: 8px 14px !important;
  margin-left: 8px;
  font-weight: 600;
}
.site-nav .site-menu > li.nav-subscribe > a:hover { background: rgba(255, 255, 255, 0.85); }
.newsletter-section {
  background: #2b5468;
  color: rgba(255, 255, 255, 0.85);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.newsletter-form .form-control {
  height: 48px;
  border: none;
  background: #fff !important;
  color: #212529 !important;
  padding: 0 16px;
}
.newsletter-form .form-control::placeholder { color: #6c757d; }
.newsletter-form .btn { height: 48px; padding: 0 28px; white-space: nowrap; font-weight: 600; color: #214252; }
@media (max-width: 575.98px) { .newsletter-form .btn { width: 100%; margin-top: 10px; } }
.newsletter-message { color: #fff; min-height: 1.5em; }
html { scroll-behavior: smooth; }

.empty-state { padding: 4rem 0; text-align: center; color: #6c757d; }