/*
  Typography Styles
  Headings, paragraphs, links
*/

/* ===== Typography Styles ===== */

body:not([lang="zh"]) .zh { display: none !important; }
body:not([lang="en"]) .en { display: none !important; }

/* Language-specific line-height adjustment */
body[lang="zh"] .poetic-text {
  line-height: 1.35; /* Chinese characters need more vertical space than Latin */
}

.poetic-text {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 30px; /* Slightly reduced for a more focused sans-serif look */
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0.01em;
  color: var(--color-text);
  margin-bottom: 0.2rem; /* Tightened to bind sentences within a stanza */
  text-align: center;
  -webkit-font-smoothing: antialiased;
}

.poetic-text .en {
  font-weight: 200;
  font-size: 34px; /* Reduced from the large serif sizes */
  letter-spacing: 0.02em;
  line-height: 1.35;
}

.poetic-text .zh {
  font-weight: 300; /* Increased to balance against English */
  font-size: 32px;  /* Increased from 28px */
  opacity: 0.9;    /* More opaque for visual weight */
  letter-spacing: 0.03em; /* Slightly tighter than before for the larger size */
  line-height: 1.45;
}

.poetic-text.italic {
  font-family: var(--font-italic);
  font-style: italic;
}

.semantic-tint {
  color: inherit;
  transition: color 1.2s var(--ease-poetic);
  cursor: default;
}

.semantic-tint.tint-green:hover { color: var(--color-tint-green); }
.semantic-tint.tint-gold:hover { color: var(--color-tint-gold); }
.semantic-tint.tint-blue:hover { color: var(--color-tint-blue); }

.brand-reveal {
  color: inherit;
  transition: all 0.8s var(--ease-poetic);
  cursor: default;
  display: inline-block;
  background-size: 200% auto;
  background-clip: text;
  -webkit-background-clip: text;
}

.brand-reveal:hover {
  color: transparent;
  background-image: linear-gradient(135deg, #6e8efb 0%, #a777e3 30%, #eb8a8f 60%, #f6d365 100%);
  background-position: right center;
  transform: scale(1.02); /* Slight pop when the magic happens */
}

.mono-small {
  font-family: -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-grey);
}

.lang-switch-link {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text);
  text-decoration: none;
  opacity: 0.5;
  transition: all 0.3s var(--ease-poetic);
  cursor: pointer;
  
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border-radius: 10px;
  background: transparent;
  
  margin-bottom: 4rem; /* Spacing between toggle and copyright */
}

.lang-switch-link:hover {
  opacity: 1;
  background: var(--color-hover-glow);
}