* { box-sizing: border-box; }
html, body {
  margin: 0;
  padding: 0;
}
body {
  font-family: Arial, Helvetica, sans-serif;
  background-color: #f7f5f0;
  color: #222;
  max-width: 900px;
  margin: 0 auto;
  padding: 1.5rem 1.25rem 3rem;
  line-height: 1.6;
}
h1.title {
  text-align: center;
  font-size: 2rem;
  margin: 1.5rem 0 2rem;
  letter-spacing: 0.05em;
  font-family: Arial, Helvetica, sans-serif;
}
h2.section-title {
  text-align: center;
  font-size: 1.4rem;
  margin: 2rem 0 1.25rem;
  letter-spacing: 0.04em;
  font-family: Arial, Helvetica, sans-serif;
  color: #2c5f8a;
}
.book-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  white-space: normal;
}
.book-links a.book-btn {
  display: inline-block;
  background-color: #2c5f8a;
  color: #ffffff;
  text-decoration: none;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  padding: 0.65rem 1rem;
  border-radius: 6px;
  text-align: center;
  transition: background-color 0.2s ease;
}
.book-links a.book-btn:hover,
.book-links a.book-btn:focus {
  background-color: #1e4160;
}

@media (max-width: 600px) {
  body {
	padding: 1rem 0.75rem 2rem;
	font-size: 1rem;
  }
  h1.title {
	font-size: 1.5rem;
	margin: 1rem 0 1.5rem;
  }
  h2.section-title {
	font-size: 1.2rem;
	margin: 1.5rem 0 1rem;
  }
  .book-links {
	gap: 0.5rem;
  }
  .book-links a.book-btn {
	padding: 0.55rem 0.85rem;
	font-size: 0.95rem;
  }
}
.translation-credit {
	max-width: 700px;
	margin: 2.5rem auto 0;
	padding-top: 1rem;
	border-top: 1px solid #ddd;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.85rem;
	color: #777;
}

.translation-credit p {
	margin: 0.2rem 0;
}