/* =====================================
   Lore Panel Theme
   Target: #intro-lore
   ===================================== */

#intro-lore {
  /* Color palette */
  /* --lore-bg: #8fae74; */        /* lighter green background */
  --lore-bg: #bed0af;        /* lighter green background */
  --lore-border: #2f4726;    /* darker green border */
  --lore-ink: #1b1a16;

  /* Fonts */
  --lore-font-body: "Kings", var(--font-display, serif);
  --lore-font-display: "Kings", var(--font-display, serif);

  position: relative;
  box-sizing: border-box;
  display: block;

  width: min(100%, 1180px);
  margin: 0 auto 1rem;

  padding: 2.25rem 3rem;

  color: var(--lore-ink);
  background: var(--lore-bg);

  font-family: var(--lore-font-body);
  font-size: 1.20rem;
  line-height: 1.62;

  /* New border system */
  border: 3px solid var(--lore-border);
  border-radius: 14px;

  box-shadow: none;
}

/* Paragraph text */

#intro-lore p {
  margin: 0;
  color: var(--lore-ink);
}

/* Signature line */

#intro-lore .signature {
  margin-top: 1rem;
}

/* Headings */

#intro-lore h1,
#intro-lore h2,
#intro-lore h3 {
  margin: 0 0 0.85rem 0;
  color: var(--lore-ink);

  font-family: var(--lore-font-display);
  font-weight: 400;
  line-height: 1.2;
}

/* Tablet */

@media (max-width: 900px) {
  #intro-lore {
    width: 100%;
    padding: 1.8rem 2rem;
  }
}

/* Mobile */

@media (max-width: 640px) {
  #intro-lore {
    padding: 1.4rem 1.4rem;
    font-size: 1rem;
  }
}