/* ==========================================================================
   ABOUT PAGE
   ========================================================================== */

.about-page {
  padding-top: 9rem;
  padding-bottom: var(--section-py);
  min-height: 80vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.about-container {
  max-width: 720px;
  margin-inline: auto;
}

.about-header {
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.about-content {
  display: flex;
  flex-direction: column;
  gap: 1.85rem;
  font-size: clamp(1.05rem, 2vw, 1.2rem);
  line-height: 1.85;
  color: var(--color-text-main);
}

.about-content p {
  color: var(--color-text-muted);
}

/* Typography Accent Colors (純粋な文字色のみ。text-shadow/glow/マーカー背景なし) */
.text-neon-green {
  color: var(--color-accent); /* #A3E635 / NEON GREEN */
}

.text-neon-yellow {
  color: var(--color-neon-yellow); /* #FAFF00 / NEON YELLOW */
}

.text-neon-pink {
  color: var(--color-neon-pink); /* #FF1A8C / NEON PINK */
}

.about-link-group {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border);
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.about-x-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--color-neon-pink);
  transition: color var(--transition-fast), transform var(--transition-fast);
}

.about-x-link:hover {
  color: var(--color-neon-yellow);
  transform: translateX(4px);
}