:root {
  /* Primary text color, easy to change everywhere */
  --primary-text-color: #d9d7d4;
  --background-color: #333;
  --accent-color: #add884;
  --border-color: #ddd;
  /*--primary-text-color: #333; /* Dark charcoal for readability */
  /*--background-color: #f9f7f4; /* Off-white, like aged paper */
  /*--accent-color: #8a6e5a; /* Soft coffee brown for accents */
  /*--border-color: #ddd; */
}

/* NK57 - for the titles */
/* Bold */
@font-face {
  font-family: 'NK57';
  src: url('./fonts/nk57-bold.otf') format('opentype');
  font-weight: 700; 
  font-style: normal;
}

/* DRAFTING MONO - for the main text */
/* Regular */
@font-face {
  font-family: 'DraftingMono';
  src: url('./fonts/draftingMono-regular.woff2') format('woff2');
  font-weight: 400; 
  font-style: normal;
}
/* Bold */
@font-face {
  font-family: 'DraftingMono';
  src: url('./fonts/draftingMono-bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}
/* Italic */
@font-face {
  font-family: 'DraftingMono';
  src: url('./fonts/draftingMono-italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
}

body {
  background-color: var(--background-color);
  color: var(--primary-text-color);
  font-family: "DraftingMono";
  font-size: 1.15rem;
  padding: 20px;
  /* Centers content and limits width to 65 characters equivalent (approx 40-45 chars depending on font metrics, but setting a sensible max-width) */
  max-width: 65ch; 
  margin: 0 auto;
  line-height: 1.6;
}

/* Headings */
h1, h2, h3 {
  color: var(--accent-color);
  font-family: "NK57";
  /* border-bottom: 1px solid var(--border-color);*/
  padding-bottom: 0.3em;
  margin-top: 1.5em;
  margin-bottom: 0.8em;
  text-transform: uppercase;
  font-weight: 700; 
}

h1 {
  font-size: 3.2rem;
}

h2 {
  font-size: 2.2rem;
}

h3 {
  font-size: 1.5rem;
}

/* Lists */
ul {
  margin-top: 0.5em;
  margin-bottom: 1em;
  padding-left: 1.5em;
}

ol {
  margin-top: 0.5em;
  margin-bottom: 1em;
  padding-left: 1.5em;
}

/* Links */
a {
  color: var(--accent-color);
  text-decoration: none;
/*  border-bottom: 1px dotted var(--accent-color); */
}

a:hover {
  color: #5e4d41; /* Slightly darker on hover */
  border-bottom-color: #5e4d41;
}

/* Blockquotes */
blockquote {
  border-left: 4px solid var(--accent-color);
  padding: 10px 20px;
  margin: 1.5em 0;
  background-color: #f0efe9; /* Very light background wash */
  color: #555;
  font-style: italic;
}