@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  --color-bg: #F6F4E8;
  --color-dark: #1D3124;
  --color-sage: #BACEC1;
  --color-terracotta: #E59560;
}

body {
  background-color: var(--color-bg) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 300 !important;
  color: var(--color-dark) !important;
}

header, .bg-dark-green, .cover-main,
section.bg-dark-green, nav {
  background-color: var(--color-bg) !important;
}

header a, header nav a {
  color: var(--color-dark) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 400 !important;
  font-size: 1rem !important;
}

header nav a:hover, header a:hover {
  color: var(--color-terracotta) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'DM Serif Display', serif !important;
  font-weight: 400 !important;
  color: var(--color-dark) !important;
}

p, li, blockquote {
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 300 !important;
  color: var(--color-dark) !important;
}

/* Reduce top gap on main content */
main {
  padding-top: 0 !important;
}

article, .ph3 {
  padding-top: 1rem !important;
}

/* Pull content up */
.pb7 {
  padding-bottom: 2rem !important;
}

a {
  color: var(--color-terracotta) !important;
}

a:hover {
  color: var(--color-dark) !important;
}

header a, header nav a {
  color: var(--color-dark) !important;
}

.bg-near-white, .bg-white {
  background-color: var(--color-bg) !important;
}

b, strong {
  font-weight: 500 !important;
}

/* Footer */
footer {
  background-color: var(--color-bg) !important;
  color: var(--color-dark) !important;
}

footer a {
  color: var(--color-dark) !important;
}

/* Footer — pin to bottom, smaller text */
footer {
  position: fixed !important;
  bottom: 0 !important;
  width: 100% !important;
  font-size: 0.65rem !important;
  padding: 0.5rem 1rem !important;
}

main {
  padding-bottom: 3rem !important;
}

footer, footer p, footer a, footer span {
  font-size: 0.65rem !important;
}

/* Terracotta underline on site title */
nav a.f3 {
  border-bottom: 1.5px solid #E59560 !important;
  padding-bottom: 2px !important;
  text-decoration: none !important;
}

/* Tags styling */
.tags a, a[href*="/tags/"] {
  display: inline-block !important;
  padding: 4px 12px !important;
  margin: 4px 6px 4px 0 !important;
  border: 1px solid #1D3124 !important;
  border-radius: 20px !important;
  font-size: 0.75rem !important;
  color: #1D3124 !important;
  text-decoration: none !important;
  letter-spacing: 0.03em !important;
}

.tags a:hover, a[href*="/tags/"]:hover {
  background-color: #1D3124 !important;
  color: #F6F4E8 !important;
}