/* --- GROK TEXT --- */
.grok-text {
  font-family: "Courier New", Courier, monospace;
  font-size: 1rem;
  max-width: 700px;
  margin: 0 auto;
  color: #ccc;
  line-height: 1.5;
  background-color: black;
  padding: 2rem;
  box-sizing: border-box;
  user-select: none;
}

.grok-text .grok-word {
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida", sans-serif;
  font-weight: 700;
  font-size: 4rem;
  letter-spacing: -0.05em;
  color: #bbb;
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  user-select: none;
}

.grok-text .grok-phonetic {
  font-family: Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.2rem;
  color: #eee;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  user-select: none;
}

.grok-text .phonetic-core {
  display: inline-block;
  letter-spacing: -0.08em; /* readable but tight */
  margin-right: 0.2em;     /* spacing between repeated /grok/ */
  vertical-align: baseline;
  user-select: none;
}

.definition-intro,
.definition-emphatic,
.definition,
.definition.continuation {
  margin: 1rem 0;
  text-indent: 0;
}

.definition-intro,
.definition-emphatic,
.definition,
.definition.continuation {
  max-width: 650px;
}

.definition strong {
  font-weight: 900;
  margin-right: 0.5em;
  color: #ccc;
}

.definition.continuation {
  margin-top: 0.5rem; /* slightly tighter space */
}

.quote {
  text-align: right;
  font-style: italic;
  color: #aaa;
  margin-top: 0;
  max-width: 650px;
  padding-right: 16px;
  user-select: none;
}

/* --- CONTACT INFO --- */
.contact-info {
  font-family: var(--font-family);
  font-size: 14px;
  color: var(--text-color);
  margin-top: 1rem;
  line-height: 1.5;
}

.contact-info a {
  color: var(--text-color);
  text-decoration: none;
}

.contact-info a:hover {
  color: var(--text-color);
  text-decoration: underline;   /* underline appears on hover */
  color: var(--link-color);     /* stays white */
}