/* styles.css */

body {
  font-family: "Georgia", "Times New Roman", serif;
  line-height: 1.7;
  color: #2c3e50;
  max-width: 850px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

h1, h2, h3, h4 {
  font-family: "Helvetica Neue", Arial, sans-serif;
  color: #1a3a5c;
  border-bottom: 2px solid #e0e6ed;
  padding-bottom: 0.3rem;
}

h2 {
  margin-top: 2.5rem;
  color: #1a5276;
}

h3 {
  margin-top: 1.8rem;
  color: #2874a6;
  border-bottom: none;
}

/* Callouts mooier maken */
.callout {
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  margin: 1.2rem 0;
}

.callout-note {
  border-left: 5px solid #3498db;
  background-color: #eaf4fc;
}

.callout-tip {
  border-left: 5px solid #27ae60;
  background-color: #eafaf1;
}

.callout-warning {
  border-left: 5px solid #e67e22;
  background-color: #fef5e7;
}

.callout-important {
  border-left: 5px solid #8e44ad;
  background-color: #f4ecf7;
}

/* Blockquotes */
blockquote {
  border-left: 4px solid #bdc3c7;
  padding-left: 1rem;
  color: #555;
  font-style: italic;
}

/* Lijsten */
ul li {
  margin-bottom: 0.4rem;
}

/* Titel */
.title {
  color: #1a3a5c;
  font-size: 2.2rem;
}

.subtitle {
  color: #5d6d7e;
  font-size: 1.2rem;
  font-style: italic;
}