/* Keep the existing green / charcoal portfolio theme across every route. */
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 72px; }
.typed-strings { display: none; }
.hero-content h2 { min-height: 2.6em; }
a:focus-visible, button:focus-visible { outline: 3px solid #087c58; outline-offset: 5px; }
.project-page { min-height: 100vh; display: flex; flex-direction: column; }
.project-page main { flex: 1; }
.project-page .card { border-color: #dee2e6; }
.project-page .card img { max-height: 280px; object-fit: cover; }
.project-page .navbar-toggler { position: static; width: auto; height: auto; padding: .5rem; }
.project-page .navbar-toggler-icon { display: inline-block; }
#draft-result { overflow-wrap: anywhere; }
.form-label { font-size: 1rem; }
@media (min-width: 992px) { section[id] { scroll-margin-top: 0; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .hero-bg { background-attachment: scroll !important; }
}
/* Accessible contrast within the existing green palette. */
.btn-primary, .btn-primary:hover, .btn-primary:focus { background-color: #087c58; border-color: #087c58; }
.text-primary { color: #087c58 !important; }
a { color: #087c58; }
a:hover { color: #065b41; }
.btn-outline-primary { color: #087c58; border-color: #087c58; }
.hero-content .btn-outline-primary { color: #75e8bd; border-color: #75e8bd; }
.bg-dark a:not(.btn) { color: #dfe8e4; }
.project-page { background: #f8f9fa; }
.project-page .navbar-toggler .navbar-toggler-icon {
  position: static; width: 1.5em; height: 1.5em; margin: 0; opacity: 1;
  background-color: transparent; transform: none;
}
@media (max-width: 991.98px) {
  .project-page .navbar-collapse { position: static; width: 100%; background: #111418 !important; }
  .side-header #header-nav { background: #111418 !important; }
}
.project-page .navbar-toggler .navbar-toggler-icon {
  background-image: var(--bs-navbar-toggler-icon-bg);
  background-repeat: no-repeat; background-position: center; background-size: 100%;
}
@media (min-width: 992px) { .project-page .navbar-toggler { display: none; } }
