/* PG Glossary */

.pg-glossary-item {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center; /* vertical centering */
  align-items: center; /* horizontal centering + prevents stretching */
  text-align: center;
  padding: 1em;
  max-width: 600px;
  margin: auto auto 3em auto;
  border-radius: var(--pg-border-radius);
  box-shadow: var(--pg-box-shadow);
}

.pg-glossary-item:hover {
  background-color: #b0e5ff;
  transform: scale(1.05);
}

.pg-glossary-image {
  width: clamp(80%, 300px, 100%);
  border-radius: var(--pg-border-radius);
}

.pg-glossary-term {
  font-size: 150%;
  font-weight: bold;
}

.pg-glossary-transliteration {
  font-style: italic;
}

.pg-glossary-meaning {
  display: block;
}

.pg-glossary-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10%;
  max-width: 1500px;
  margin: 0 auto;
  align-items: start;
  margin-top: 2em;
}

.pg-glossary-item {
  flex: 1 1 40%;
  min-width: 300px;
  display: flex;
  flex-direction: column;
}

.pg-listen {
cursor: pointer;
}