:root {
  --site-ink: #101820;
  --site-text: #18212a;
  --site-red: #d64545;
  --site-teal: #1f7a8c;
  --site-paper: #f4efe8;
  --site-warm: #e0b84f;
}

body {
  background: var(--site-paper);
  color: var(--site-text);
  font-family: "Libre Franklin", Arial, sans-serif;
  line-height: 1.65;
}

h1, h2, h3, h4, .navbar-brand, .footer-brand {
  font-family: "Fjalla One", Impact, sans-serif;
  letter-spacing: 0;
}

.site-navbar {
  border-bottom: 3px solid var(--site-red);
}

.navbar-brand {
  text-transform: uppercase;
}

.navbar .nav-link {
  font-weight: 700;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: var(--site-warm);
}

.site-hero {
  background-color: var(--site-ink) !important;
  background-image: none !important;
  min-height: 56vh;
}

.hero-image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border: 6px solid rgba(255, 255, 255, 0.18);
}

.content-band,
.thin-page,
.article-shell,
.category-shell {
  background: var(--site-paper);
}

.site-prose {
  background: rgba(255, 255, 255, 0.72);
  border-left: 4px solid var(--site-red);
  padding: clamp(1.25rem, 3vw, 2.5rem);
}

.site-prose p,
.site-prose li {
  font-size: 1rem;
}

.site-prose a,
.content-card a,
.breadcrumb a,
.article-toc a {
  color: var(--site-red);
  text-decoration: underline;
  text-decoration-color: rgba(214, 69, 69, 0.35);
  text-underline-offset: 0.18em;
}

.site-prose a:hover,
.content-card a:hover,
.breadcrumb a:hover,
.article-toc a:hover {
  color: var(--site-teal);
  text-decoration-color: currentColor;
}

.site-figure img,
.card-grid img,
.article-main-image {
  max-width: 100%;
  height: auto;
}

.content-card {
  border-color: rgba(16, 24, 32, 0.12);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.content-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 1rem 2rem rgba(16, 24, 32, 0.08);
}

.minimal-card {
  border-left: 3px solid var(--site-teal);
  padding: 1rem 1.25rem;
  background: rgba(255, 255, 255, 0.62);
}

.article-toc {
  background: #fff;
  border: 1px solid rgba(16, 24, 32, 0.12);
  padding: 1rem;
  margin-bottom: 1.5rem;
}

.article-toc ul {
  margin: 0;
  padding-left: 1.2rem;
}

.toc-sticky {
  top: 5rem;
}

.article-main-image {
  width: min(33%, 320px);
}

.site-footer {
  border-top: 4px solid var(--site-red);
}

.footer-brand {
  color: #fff;
  text-transform: uppercase;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: flex-md-end;
}

.footer-links a {
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
}

.footer-links a:hover,
.footer-links a:focus {
  color: var(--site-warm);
}

@media (max-width: 767.98px) {
  .site-hero {
    min-height: auto;
  }

  .article-main-image {
    width: 100%;
    float: none !important;
    margin-left: 0 !important;
  }

  .footer-links {
    justify-content: flex-start;
  }
}

@media print {
  .site-navbar,
  .site-footer,
  .article-toc {
    display: none !important;
  }

  body {
    background: #fff;
    color: #000;
  }
}
